首页 > 移动平台 > 详细

4.移动端适配--rem的配置

时间:2021-01-17 19:55:42      阅读:46      评论:0      收藏:0      [点我收藏+]

1、安装插件

安装: npm install lib-flexible postcss-px2rem

2、删除public中index.html里面的meta标签

删除<meta name=‘viewport‘>标签,flexible会自动为页面添加此标签,动态控制initial-scale,maximum-scale,minimum-scale等属性值

3、在main.js中导入插件flexible

导入rem的js,动态设置不同屏幕的html根元素的font-size
import ‘lib-flexible‘

4、配置vue.config.js

devServer:{},
css:{
    loaderOptions:{
        css:{},
        postcss:{
            plugins:[
                require(‘postcss-px2rem‘)({
                    //适配375的屏幕,设计图750中量出来的尺寸要除以2
                    remUnit:37.5
                })
            ]
        },
    }
}

4.移动端适配--rem的配置

原文:https://www.cnblogs.com/mu--yu/p/14289281.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!