ＨＴＭＬ5对手机等移动终端的网页适配

如题。

        一个电脑端的页面尺寸是非常大的。在针对移动端的设备开发中，就必须采取一些特殊的处理方法。

        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">

      通过这样子的设置，就可以使得原本在电脑端显示正常的页面在移动页面也正常显示。