На iPad с помощью Safari перейдите на эту страницу: http://ifelse.org/projects/errors/viewport/test.html
Это источник:
<html>
<head>
<title>Viewport Test</title>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="viewport" content="width=1030" />
<style>
body {
padding: 0;
margin: 0;
}
#test {
width: 1024px;
height: 500px;
border: 3px solid #ccc;
}
</style>
</head>
<body>
<div id="test">
<p>This is 1024 with a 3px border, so device width is 1030.</p>
<p>Works when viewing in Mobile Safari.</p>
<p>Does not work if you Bookmark it to the Home Screen and open from there.</p>
<p>Compare <a href="viewport_1030_safari.png">MobileSafari</a> view to <a href="viewport_1030_webapp.png">Webapp</a> view.</p>
</div>
</body>
</html>
Это должно выглядеть как это изображение, где viewport
из 1030пиксели полностью видны в портретном режиме:
- Коснитесь Значок закладок (+)
- Коснитесь Добавить на главный экран
- Закладка создана.Откройте закладку, и веб-страница откроется в режиме веб-приложения с полноэкранным режимом.
Тег viewport
по существу игнорируется.Я пробовал несколько вариантов подать в суд на устройство со смешанными значениями пикселей.Ничего.
Итак ... это ошибка или особенность?
Если это намеренно со стороны Apple, это, по сути, означает правильную разработку нужных веб-приложений, которые вам нужны.перейти с фактической шириной 768 пикселей ...?