頁(yè)面布局:
1只嚣、流體布局:
%分比+float布局
彈性盒子
思路:寬度是百分比,高度自適應(yīng)
缺點(diǎn):和設(shè)計(jì)圖整體感覺(jué)不太一樣
2、定寬布局:
直接切成320
缺點(diǎn):超過(guò)320的兩邊會(huì)有路邊
min-width:320
max-widht:640
思路:寬度百分百,加最大值最小值,高度內(nèi)容撐開(kāi)
jd
3安疗、相對(duì)單位布局
%? 相對(duì)父級(jí)寬度
em? 相對(duì)父級(jí)的字體大小
---
vw? 相對(duì)可視區(qū)寬度
vh
v viewport
1vw=1%可視區(qū)寬度
vmax
相對(duì)于可視區(qū)寬度高度重最大的一個(gè)
vmin
相對(duì)于可視區(qū)寬度高度重最小的一個(gè)
rem root element of font-size
html的字體大小
10px=62.5%
pc端chrome里面自小字體是12抛杨,真機(jī)移動(dòng)端沒(méi)有問(wèn)題
20
50
找一個(gè)基準(zhǔn)
320
5 320? ? 20
6 375? ?? ? ? ? ? ? 23.4375
6p 414? 荐类?? ? ? ? ? ? 25.875
在不同的機(jī)器上改變html的字體大小
document.documentElement.style.fontSize=20*document.documentElement.clientWidth/320
設(shè)計(jì)師的圖紙 2倍或者3倍或者1.5
圖紙640
重點(diǎn):*****
1怖现、先看圖紙是幾倍圖? 320 2
2、計(jì)算時(shí)候,量出的數(shù)/幾倍/html字體大小