一.
設定html 預設字型大小
1,document
.getelementsbytagname
("html")[0
].style.fontsize =
window
.innerwidth /
10 +
'px'
;2. var htmlwidth=document.documentelement.clientwidth || document.body.clientwidth;//獲取視窗寬度
var htmldom=document.getelementsbytagname('html')[0]; //獲取html,以便對其進行操作
htmldom.style.fontsize=htmlwidth/10+'px';//html的font-size是螢幕寬度的十分之一
二.rem
1rem == html 預設的 font-size;
以iphone 6 為基準
1rem == 37.5px
@function px2rem($px)
75px==
都是*2設計的
,所以在這裡 iphone6/7
/8 == 750px*1334px
例:$height88
:px2rem
(88px
);$height88 ==
88/75 ==
1.173333333333333
rem
三.meidia query 的使用方法
1、直接寫在css樣式裡面 /*當寬度大於320px時，此樣式才生效*/
@media screen and (max-width:320px)
2、
移動web開發與適配
1.定高，寬度百分比 2.flex布局 3.查詢 media 型別 and 特性 型別 screen print 特性 max width max height demo media screen and max width 320px media screen and min width 321p...
rem筆記與移動web開發適配
rem原理與簡介 常見移動web適配方法 pc 移動web media query 查詢 media 型別 and 特性 型別 screen，print 特性 max width，max height rem font size of the root element 適配原理 相容性 1rem 瀏...
移動端web適配
移動端web適配我了解的總共有4種方法 首先在做移動端開發的時候一定會加上viewport name viewport content width width device,initial scale 1 minimum scale 1,maximum scale 1,user scalable n...