3771人阅读
web前端（45）
& & & & 一个电脑端的页面尺寸是非常大的。在针对移动端的设备开发中，就必须采取一些特殊的处理方法。
& & & & html5提供了一个非常便捷的解决方法：viewport。
& & & & 通过这个meta标签就可以使得页面在移动端的设备屏幕全屏显示，并且禁止用户使用触屏的缩放功能。使用该标签后，建议对网页下的所有元素的宽度都采用百分比设置。也可以通过javascript中的screen.width()这个函数来调用取得设备的屏幕宽度，然后对各个元素的宽度进行设置。
& & & & 对于margin,padding等元素的属性，也可以使用auto和百分比等的方式对元素进行大小限制。
& & & & 这个代码如下：
&meta name=&viewport& content=&width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no&&
& & & &对于苹果手机的safari浏览器，还有两个特别的标签：
&meta name=&apple-touch-fullscreen& content=&YES&&
&meta name=&apple-mobile-web-app-capable& content=&yes&&
& & & 通过这样子的设置，就可以使得原本在电脑端显示正常的页面在移动页面也正常显示。
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：256658次
积分：3633
积分：3633
排名：第7528名
原创：107篇
转载：28篇
评论：235条
(1)(2)(3)(21)(6)(6)(23)(5)(18)(1)(10)(4)(3)(4)(10)(2)(6)(10)}