web适配手机端开发总结

现在手机端也业务要多于pc端，如何做手机端的web页面也成了许多web前端工程师的必修课，以下是我总结的一些心得，大家茶余饭后研读一下，看看能不能涨涨姿势。

适配手机端我主要总结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.框架推荐：uniapp或taro

uniapp：可以自行百度一下，一套代码同时可以编译八端，天生适合移动端开发，其自带rpx可以让开发者通过rpx布局。

taro：是京东推出的跨平台框架，它可以编译成RN、H5等，它使用react开发，也是移动端开发的首选。