HTML5 Boilerplate: Метапорт и ширина = ширина устройства
Я создаю адаптивный / адаптивный веб-сайт.
Что касается этого недавнего изменения HTML5BP:
& Quot;ревизии для мобильных устройств / iOS css& Quot;
Я начал использовать:
<meta name="viewport" content="width=device-width">
... и у меня есть это в моем CSS:
html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
когдаinitial-scale=1
при включении поворота от вертикального к горизонтальному (на iPad / iPhone) макет изменился с 2 столбцов (например) на 3 столбца (из-за запросов meida,initial-scale=1
а такжеИсправление JS для ошибки масштаба окна просмотра).
To summarizeв ландшафтном режиме это увеличивает страницу:
<meta name="viewport" content="width=device-width">
... а это не
<meta name="viewport" content="width=device-width, initial-scale=1">
Note: You can see this zooming effect in action when viewing the HTML5BP сайт на iPad / iPhone.
Мои вопросы:
Is this becoming the new standard (i.e. zoom when in landscape mode)? I'm having a heck of a time explaining this change to my co-workers and bosses... They're used to seeing a different layout in horizontal mode; now that the page zooms and the layout stays the same (except it's larger). Any tips on how to explain this to the ignorant masses (of which, I might be included)?@robertc: Спасибо! Это очень полезно.
Мне на самом деле нравитсяnot имеяinitial-scale=1
; это мои коллеги, которые привыкли видеть изменение макета, а не масштабирование. Я уверен, что будуforced добавитьinitial-scale=1
просто чтобы угодить всем (потому чтоnot увеличение и просмотр изменения макета - это то, что они привыкли видеть).
Я только что заметил HTML5BPindex.html на github, а такжевеб-сайтиспользовала<meta name="viewport" content="width=device-width">
; для меня это достаточно веская причина, чтобы броситьinitial-scale=1
, но я поднимаю брови, когда пытаюсь объяснитьэти вещи к "не фанатам". : D