码迷,mamicode.com
首页 > 移动开发 > 详细

有关移动端适配的问题

时间:2020-03-10 01:46:28      阅读:64      评论:0      收藏:0      [点我收藏+]

标签:文章   minimum   fun   独立   像素   限制   imu   html   init   

移动端适配这一块,

有好多种方案。

viewport + rem:

viewport + vw

js动态设置: 参考文章 http://caibaojian.com/flexible-js.html

一般来说,用下面的这个viewport:

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0"/>

width=device-width:设置布局视口的大小等于设备独立像素;

initial-scale=1.0:设置布局视口和视觉视口的大小等于设备独立像素;

user-scalable=no:不允许用户进行缩放;

minimum-scale和maximum-scale 

分别这只最小的缩放为1.0,最大的缩放为1.0,表示不允许用户进行缩放操作。

但是有几个原则要考虑一下: 字体使用px 限制根元素的大小 使用sass中的function做到单位变换

参考资料:

          浅谈移动端三大viewport https://www.cnblogs.com/ssh-007/p/7196748.html

          移动端适配问题https://www.kancloud.cn/xiaomingjun/interview/909768

    flexible.js 布局详解http://caibaojian.com/flexible-js.html

    amfe-flexible         https://github.com/amfe/lib-flexible?utm_source=caibaojian.com

有关移动端适配的问题

标签:文章   minimum   fun   独立   像素   限制   imu   html   init   

原文地址:https://www.cnblogs.com/whdaichengxu/p/12452767.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!