当我们将一个pc端的网页放到移动端的时候,移动端浏览器会将pc端的网页按照一定的比例完整的显示出来,这是因为移动端的浏览器默认的会将网页渲染在一个比例比较大的viewport中排版(ios默认的是980px,Android4.0以上为980px),然后通过比例缩放看到整个页面的全貌。
但是,使用默认的viewport布局会有以下缺点:
宽度不可控制,不同系统不同设备的默认值可能不同
页面缩小版显示,交互不友好
链接不可点
有缩放,缩放后又有滚动
所以,我们可以通过meta标签改变viewport得到移动端网页定制化自适应的一个效果。

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimun-scale=1.0,maximum-scale=1.0,user-scalable=no">
头像
生活

本文标签:

文章标题:将pc端的网页自适应显示在移动端的方法

文章链接:https://www.mjqzz.cn/mjjs/241.html

版权声明:若无特殊注明,本文皆为 梦家 原创,转载请保留文章出处。

发表评论

电子邮件地址不会被公开。 必填项已用*标注