vue3 移动端h5适配ipad ios android rem 适配(很简单,秒懂)

  1. npm i amfe-flexible postcss-px2rem lib-flexible
    安装以上三个需要用到的插件 得到如下:
    在这里插入图片描述

  2. 前往main.js页面
    import 'lib-flexible'在这里插入图片描述

 "postcss": {
    "plugins": {
      "autoprefixer": {},
      "postcss-px2rem": {
        "remUnit": 37.5
      }
    }
  }

在这里插入图片描述
完成以上操作就大功告成,重新启动即可使用

以下是使用方式: 根据设计稿尺寸直接使用px就好了,它会自动转换
在这里插入图片描述
以下是三种机型 都适配了 会根据比例自动转化尺寸像素(iphone 安卓android ipad)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
如若按以上操作还是不行,可以评论联系我

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
THE END
分享
二维码
< <上一篇
下一篇>>