wap网页自适应宽度

Html head 标签当中加入viewport标签

<metaname="viewport"content="width=100%; initial-scale=1.0; maximum-scale=1.0;user-scalable=0;" />

关键属性：viewport

什么是viewport？

手机浏览器是把页面放在一个虚拟的“窗口”（viewport）中，通常这个虚拟的“窗口”（viewport）比屏幕宽，这样就不用把每个网页挤到很小的窗口中，这样会破坏没有针对手机浏览器优化的网页的布局，用户可以通过平移和缩放来看网页的不同部分。手机浏览器也基本支持。

Viewport属性介绍：

width - viewport的宽度

initial-scale - 初始的缩放比例

maximum-scale - 允许用户缩放到的最大比例

user-scalable - 用户是否可以手动缩放

         另外body内容以table方式布局，可以保证不同分辨率自适应后的美观。

评论

3 楼 yangli 2013-03-30  

robingdo 写道

非常感谢，请问会适配各种分辨率的手机吗？谢谢！我这边拿的是C8500测试的，可以的，不知道其他分辨率手机和苹果是不是也是好的

如果屏幕太小，业务功能的table太宽还是会变形。

2 楼 yangli 2013-03-30  

如果屏幕太小，业务功能的table太宽还是会变形。

1 楼 robingdo 2013-03-28  

非常感谢，请问会适配各种分辨率的手机吗？谢谢！我这边拿的是C8500测试的，可以的，不知道其他分辨率手机和苹果是不是也是好的