前端七班 鲁晓松
移动端web页面的设计规范是 640px 宽的 psd 设计稿, 因为现在主流的手机分辨率都是640(以求得在大多数手机上得到最佳显示效果)。
在做web页面的时候。
一般的做法是设置 html 页面的 viewport 信息为 device-width。
<meta ="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
content属性值 :
- width表示网页的布局layout宽度,值device-width表示设备宽度。
- initial-scale表示初始时的缩放比例。
- minimum-scale和maximum-scale分别表示最小和最大缩放比例。
- user-scalable:是否可对页面进行缩放,no 禁止缩放。
这时你会看到 web中的document宽度的显示的是320(模拟iphone5s时)。也就是说浏览器显示和app类似以逻辑像素为准,但单位依然是px,属值为实际像素/倍率。
更详细的内容可以访问这位简友老夫的天的文章。