建站百科

文章导读：本文主要阐述了“web页面做到适配手机的3点总结”现在手机端也业务要多于pc端，如何做手机端的web页面或者如何做到web页面同时适配手机，也成了许多web前端工程师的必修课，以下...，本文由跨屏网最后更新于2020-07-24，全文共531个字，预计阅读时长1分46秒。

适配手机端我主要总结3点：

1. 在页面顶部加meta，它的大概意思就是让页面1:1显示，用户禁止缩放，加载html页面的head中  代码如下。

<meta name=”viewport” content=”width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no”>

2.布局用百分比/rem，这个就不多解释了，只是把原来的px换成%或rem，尝试一下就知道了。值得一提的是rem这个单位直接用不太好，因为你要精确到小数点后面三四位，所以大家要用的话，百度一下rem.js，网上有很多版本，自己下载一个src引入，这样就不用精确到小数点好几位了。

div{
width:80%,
height:200px;
font-size:1rem
}
3.借助手机端开发框架,这里给大家推荐几个 vux、mint ui 、weui

手机端开发最好结合vue-cli，不推荐用bootstrap了。

写在最后，以上就是对于“web页面做到适配手机的3点总结”的一些看法，欢迎指正、交流。

本文名称：web页面做到适配手机的3点总结
转载来于：http://test.kuaping.com/article/show155.html