美文网首页饥人谷技术博客
移动端网页尺寸问题

移动端网页尺寸问题

作者: 饥人谷_鲁晓松 | 来源:发表于2015-11-19 23:08 被阅读0次
前端七班 鲁晓松

移动端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 禁止缩放。
QQ截图20151121001508.png

这时你会看到 web中的document宽度的显示的是320(模拟iphone5s时)。也就是说浏览器显示和app类似以逻辑像素为准,但单位依然是px,属值为实际像素/倍率。

更详细的内容可以访问这位简友老夫的天的文章。

相关文章

  • 移动端网页尺寸问题

    前端七班 鲁晓松 移动端web页面的设计规范是 640px 宽的 psd 设计稿, 因为现在主流的手机分辨率都是6...

  • 关于像素问题收藏的好文章

    移动端尺寸基础知识从设备像素比到移动适配弄清移动端网页中viewport、retina、高清图、dp单位等

  • 界面尺寸选择

    1.主流设计图分为移动端、网页端2大类,移动端有2大系统Android、iOS、网页端。 2.应该选择哪个尺寸出图...

  • 浅谈移动端适配

    前言 随着移动端的普及,以及手机尺寸越来越多,“网页内容自适应屏幕尺寸进行显示的问题” 也日渐凸显出来,下面讲一下...

  • H5移动端网页字体大小自适应

    现手机屏幕尺寸大小不一,HTML编写的页面在移动端在不同尺寸屏幕下适配容易出问题,所以在实际的网页编写中需要根据屏...

  • 移动端深度开发

    移动端基本环境 测试:chrome模拟的只是尺寸 移动端常见的一些问题 由于测试环境限制,暂停

  • HTML移动端及PC端页面跳转判断

    网页通常需要适配PC端和移动端,适配可以通过响应式布局如bootstrap框架判断屏幕尺寸来展示不同的效果,还可以...

  • 移动端尺寸

    一、名词解释 分辨率 说明:分辨率,又称显示分辨率、屏幕分辨率,确定手机屏幕上显示多少信息的设置,以水平和垂直的像...

  • Glide动态获取宽高,自动适配瀑布流布局,解决滑动跳动

    所遇到的问题: 问题:服务端返回的图片没有返回尺寸,移动端无法确定图片比例,导致RecyclerView的图片无法...

  • 移动端网页调试

    移动端网页调试

网友评论

    本文标题:移动端网页尺寸问题

    本文链接:https://www.haomeiwen.com/subject/moulhttx.html