Page 245 - Сила CSS3 Освой новейший стандарт

Изменение макета для просмотра на мобильных устройствах • 245

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

ние версии шириной 320 пикселов. В теге meta присвойте свойству maximum-scale
значение 1.0, чтобы браузер (и пользователь) не мог увеличивать страницу свыше
обычного размера:
<meta name="viewport" content="width=device-width,
¬ maximum-scale=1.0">

Рис. 6.23. В альбомном режи-
ме iPhone все так же выводит
страницу шириной 320 пикселов,
немного увеличивая ее под до-
ступную ширину экрана
(480 пикселов)

Теперь при просмотре страницы в альбомной ориентации Mobile Safari сохраняет
уровень масштабирования 100%, благодаря чему область просмотра макета увели-
чивается до 480 пикселов (рис. 6.24).

Рис. 6.24. Свойство maximum-
scale в теге meta заставляет
iPhone в альбомном режиме
разворачивать макет
до 480 пикселов

www.trk.kg