设置移动网页的页面宽度的设计最佳做法是什么?

时间:2009-11-13 17:40:20

标签: css mobile width mobile-website screen-resolution

不同手机上的不同浏览器具有不同的屏幕分辨率。

社区中是否有最佳做法将宽度设置为标准尺寸,以便适用于大多数现代手机和浏览器?

4 个答案:

答案 0 :(得分:7)

没有简单的方法可以确保移动浏览器的像素完美精确度(实际上,使用任何浏览器都没有简单的方法)。但是,有一些方法可以帮助完成这种工作。例如,iPhone的移动版Safari支持“视口”元标记,允许您指定宽度等属性。以下是一些使用示例:

<meta name="viewport" content="width = 750px" />

<meta name="viewport" content="initial-scale=2.5, user-scalable=no" />

Apple提供了一些信息here,您可以在网上找到更多信息。

答案 1 :(得分:3)

恕我直言,最佳做法是在没有太多关于客户端设备的宽度和分辨率的假设的情况下相处。

大多数设备都有适合显示/流动/缩小网页的浏览器。如果可能的话,让浏览器完成工作。

答案 2 :(得分:1)

天儿真好,

我知道你的问题是决定选择适合所有手机的最佳屏幕尺寸,但这种方法很快会与用户相比很少。

我与之关联的大型网站采用UserAgent字符串并将其标准化为公分母,例如:针对特定的索尼爱立信手机类型,英国使用了300多种不同的UA字符串,因此它们都转换为相同的字符串,然后查找表格以确定屏幕空间。

编码人员还可以访问当前的连接速度,该速度由地理定位应用程序根据连接类型,路由类型等推断。在请求时您不希望向连接缓慢的人发送丰富的高清媒体。

然后用于

  1. 决定是否可以提供丰富的内容,然后
  2. 选择内容的最佳格式。
  3. HTH

    欢呼声,

答案 3 :(得分:0)

您可以随时使用“ems”代替他们正确缩放的像素。

这仍然是一个棘手的话题,因为许多移动浏览器基本上都会根据开发人员想要解释的内容来解释你的内容。