先引入一个js插件remScale.js

　　不了解csdn如何上传文件，就把js代码复制在下面：自己保存一下，存到js文件里面即可，

　　写手机端页面时，把这个文件引入即可

　　这段代码的核心意思是：假如页面的宽度超越了720px，那样页面中html的font-size值恒为100px,不然的话，html中的font-size的大小为100*（目前的页面宽度/720）

　　我看百度上人家都是设置640px或750px，但大家老师设置的是720px，经过实践证明，720px也可以用，没什么问题

　　对应手机屏幕来讲，720px的页面宽度是一个安全的最大宽度，保证了手机端页面两边不会留白。这里的px是css逻辑像素（在下面给大伙补充啥是设施像素，逻辑像素，css像素）

　　设施像素是设施的固有属性，屏幕的设施分辨率是1920*1200（单位：设施像素）

　　逻辑像素也叫设施独立像素，与css像素一样是一种虚拟的像素，它是操作系统概念的一种像素单位，应用程序将逻辑像素告诉操作系统，操作系统再将逻辑像素转为设施像素。

　　可以通过操作系统的分辨率设置来改变设施独立像素的大小，但在前端开发中可以当作定制，由于没人会闲着没事去频繁改变操作系统分辨率。

　　css像素是一个不确定的物理像素，它是依据它所在的机型设施而决定的。在css中用的px都是指css像素，如width:200px.css像素的大小，比较容易变化的。当大家**缩放页面的时候，元素的css像素数目不会改变，****改变的是每一个css像素的大小，**也就是说width:200px的元素在缩放200%将来，宽度仍然是200像素，只是每一个css像素的宽度和高度变为原来的2倍。假如原来的元素宽度为200个设施独立像素，缩放后就变成400个设施独立像素了，但css像素宽度一直是200

　　参考了：

　　响应式设计——理解设施像素、设施独立像素和css像素

　　设置font-size值是什么原因：rem就是根元素（即html）的字体大小，html中所有标签样式只须是涉及到尺寸的（height,width,font-size,padding,margin等）都可以用rem布局。

　　假如把html的font-size设为20px，前面所说rem就是html的字体大小，那样1rem就是20px。可以算出1px就是0.05rem.

　　那样宽60像素，高40像素的元素样式就可以设置为：

　　width:3rem;

　　height:2rem;

　　so,如此设置的话，要点宽55px，高37px，就得一点点计算了，是否好麻烦。

　　所以：把font-size值设置为100px，是否非常爽。此时1rem=100px.

　　那样上面的宽55px，高37px就可以设置成

　　width:0.55rem;

　　height:0.37rem;

　　so，换算起来容易多了

　　为何不刚开始把html的font-size设为1px呢，如此换算起来也容易，答：浏览器通常都有最小字体限制，譬如Google浏览器，最小中文字体就是12px，所以事实上没方法让1rem=1px。）

　　参考了：手机端页面自适应解决方法—rem布局

　　最后再给大伙说个vscode插件 easy less

希望以上内容可以解决您的问题！
如有其他问题欢迎大家一起交流学习！