自适应布局 vw 加calc()设置 根font-size
2019-08-01 本文已影响0人
时间_7436
1vw表示1%的屏幕宽度,而我们的设计稿通常是750px的,屏幕一共是100vw,对应750px,那么1px就是0.1333333vw,。
同时我们知道rem,rem是相对html元素的字体大小,为了方便计算,我们取html的font-size=100px,通过上面的计算结果1px是0.13333333vw,那么100px就是13.333333vw了
所以,我们让1rem=100px=13.333333vw
我们可以直接在html中设置 font-size:13.333333vw;
也可以使用css中的 calc()函数
上代码
html {
font-size: calc(100vw / 750 * 100);
}