Как я могу сделать viewport content-width = device-width обновлением при повороте устройства iOS?

Question

Я разрабатываю страницу, которая будет отображаться только на iPad, поэтому мне не нужно беспокоиться о том, чтобы сделать ее совместимой с чем-либо еще. Я делаю страницу, которую хочу прокручивать, но не масштабировать, и я хочу, чтобы она обновляла ширину страницы, не масштабируя содержимое.

Я пытался сделать что-то вроде этого:

<meta name='viewport' content='user-scalable=no, maximum-scale=1.0, minimum-scale=1.0, width=device-width' />

Это прекрасно работает, пока устройство не будет повернуто. Ширина страницы не обновляется до новой ширины, поэтому система бессмысленна. Как я могу сделать эту работу?

Answer 1

Одним из вариантов является наличие двух отдельных таблиц стилей, по одному для каждой ориентации (это также можно сделать на странице, если вы предпочитаете)

В каждом вы можете установить"body {width: --- px;}" для определенной ширины устройства.

Конечно, я видел другие веб-приложения для iPad, которые можно прокручивать, но не масштабировать, которые просто всегда сохраняют ширину пейзажа- у вас также есть возможность прокрутки влево или вправо в портретном режиме.В этом случае вам просто нужно определить ширину тела, как обычно, для альбомной ширины ipad, которая, как я считаю, составляет 1024 пикселей.