前端面试 移动端rem适配方案
1.适配方案
移动端的适配方案:
1.flex + rem单位 做适配效果 (比如淘宝和小米移动端)当前市场最多
2.flex + viewport width/vh单位 做适配效果 (比如B站移动端) 新兴,马上的一个趋势
让flex做布局(盒子摆放),让rem或者vw/ vh 实现网页元素的尺寸(宽度和高度)适配屏幕
Vant 中的样式默认使用px
作为单位,如果需要使用rem
单位,推荐使用以下两个工具:
- postcss-pxtorem 是一款
postcss
插件,用于将单位转化为rem
- lib-flexible 用于设置
rem
基准值
2.rem适配
2.1.rem单位
rem 是一个相对单位,1 rem就是html文字的大小
比如
html {
font-size: 36px;
}
则此时 1 rem就是36像素。