移动端 rem 适配方案

前端面试 移动端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像素。

你可能感兴趣的:(前端,浏览器,javascript)