适用于iOS设备的视口元标记

Question

说明

<meta name="viewport" content="width=device-width" />

与陈述具有相同的效果

<meta name="viewport" content="width=768" />

对于iPad？

Answer 1

这取决于设备的方向:设置特定的像素值将使您的布局按比例放大1.333,以便在横向模式下适合1024px设备宽度.

width=device-width另一方面,设置不会缩放任何内容,但会更改视口宽度,然后您可以使用媒体查询制作优化的布局.或者至少是理论:width=device-width即使在横向模式下,iPad 也会以某种方式解释为768px.为了获得真实的设备宽度,您必须添加initial-scale = 1.

因此,我不同意詹姆斯的建议.只是去:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

并使用液体/响应布局技术处理尺寸差异.