VSCode一个简单的vue移动端适配方案
我这里UI给的设计图都是750px，所以750px / 15(份) = 50 rem
(function(){ var pixRatio=1/window.devicePixelRatio; document.write('<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale='+pixRatio+',minimun-scale='+pixRatio+',maximun-scale='+pixRatio+'" />'); var html=document.documentElement; var hWidth=html.getBoundingClientRect().width; html.style.fontSize=hWidth/15+'px'; })()复制代码 接着在VSCode安装一个插件用于转换rem(cssrem)
这是插件下载地址，也在可以VSCode扩展商店下载
https://marketplace.visualstudio.com/items?itemName=cipchk.cssrem
这里是vsCode的配置方法：
文件-->首选项-->设置-->搜索cssrem
配置px转rem的参数Cssrem: Fixed Digits =>px转换rem的需要保留的小数点
Cssrem: Root Font Size => px转换为rem的基准
（也就是 750 / 15 = 50 <=> 设计图 / 需要分成多少份 = 转换rem的基准）
到这里就配置好了，记得重启一下编辑器
最后的效果就是
相关知识
Vue移动端系列 =＞ [总结] 项目启动总结
移动端
如何从零高效的开发一款适配 Android 和 iOS 的移动端App
手机移动端快速开发
基于深度卷积神经网络的移动端花卉识别系统
vscode插件原理浅析与实战
鲜花网项目实战（一）
Html+Css+js实现春节倒计时效果（移动端和PC端）
大气漂亮的紫色网上花店企业网站模板
Nodejs+vue+mysql花卉鲜花商城销售系统
网址: VSCode一个简单的vue移动端适配方案 https://m.huajiangbk.com/newsview849655.html
| 上一篇: 百度UEditor编辑文章，移动 |
下一篇: 【移动适配】移动Web怎么做屏幕 |
