#ipad #html #viewport #meta-tags
#iPad #HTML #область просмотра #мета-теги
Вопрос:
Указывает ли
<meta name="viewport" content="width=device-width" />
имеет тот же эффект, что и указание
<meta name="viewport" content="width=768" />
для ipad?
Ответ №1:
Это действительно зависит от ориентации устройства: установка определенного значения пикселя приведет к масштабированию вашего макета с коэффициентом 1,333, чтобы он соответствовал ширине устройства 1024 пикселей в альбомном режиме.
width=device-width
С другой стороны, настройка ничего не увеличит, но изменит ширину области просмотра, для которой затем можно создать оптимизированный макет с помощью медиазапросов. Или это, по крайней мере, теория: iPad каким-то образом интерпретирует width=device-width
как 768 пикселей даже в ландшафтном режиме. Чтобы получить реальную ширину устройства, вы должны добавить начальный масштаб = 1.
Следовательно, я не согласен с предложением Джеймса. Просто идите за:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
и справляйтесь с различиями в размерах, используя методы гибкой / адаптивной компоновки.
Комментарии:
1. Спасибо за ответ, Андреас, у меня создалось впечатление, что device-width возвращает ширину устройства ipad (768 пикселей), независимо от того, было ли оно в книжном или альбомном формате
2. Поздний ответ. Вы правы. <meta name=»viewport» content=»width=device-width, initial-scale = 1″> необходим для получения реальной ширины устройства на iPad.
3. У меня это не работает, по какой-то причине в альбомной ориентации ширина устанавливается на некоторое значение, превышающее ширину альбомной ориентации устройства, без уважительной причины.
4. ОБНОВЛЕНИЕ : исправлено, также установив
maximum-scale=1