@media screen and (max-width: 799px) {
}
html {
font-size: calc(100vw / 799 * 16)
/*100px*/
;
}
@media screen and (min-width: 800px) {
}
用媒体查询控制布局,比如元素的显示与隐藏,位置的变化等
font-size: calc(100vw / 750 * 100);
font-size:13.333333vw;
/*设计稿宽度大小是750的时候,100vw/799表示1px的大小,即为0.1333333vw,
所以如果我们想取font-size为100px时(方便取值),就乘100即可,也就是13.333333vw,
这样,网页的元素的1rem=100px,并且随着屏幕的大小变化而实时变化*/
用calc函数配合vw控制内容实时变化,也就是网页元素随着屏幕的大小变化而变化,1vw代表屏幕的百分之一,100vw就是百分百,就是整个屏幕的宽度,同理,vh也如此
参考:https://www.jianshu.com/p/8817e26d3c46
版权声明:本文为qq_43516282原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。