Я схильний використовувати це:
Хоча я бачу, що це рекомендується багато:
Це означає, що браузер (можливо) буде відображати ширину сторінки на ширині власного екрану. Отже, якщо цей екран має ширину 320 пікселів, вікно браузера буде шириною 320 пікселів, а не таким чином, щоб зменшувати масштаб і показувати 960 пікселів (або що б цей пристрій робив за замовчуванням, замість адаптивного метатегу).
Примітка: не використовуйте адаптивний мета-тег, якщо ваш веб-сайт не розроблений спеціально для того, щоб реагувати та працювати належним чином на такому розмірі, оскільки це погіршить роботу.
Цей тег підтримує більше атрибутів:
Власність | Опис |
---|---|
ширина | Ширина віртуального вікна перегляду пристрою. |
ширина пристрою | Фізична ширина екрану пристрою. |
висота | Висота «віртуального вікна перегляду» пристрою. |
пристрій-висота | Фізична висота екрану пристрою. |
початково-масштабна | Початкове масштабування під час відвідування сторінки. 1.0 не збільшує масштаб. |
мінімальний масштаб | Мінімальна сума, яку відвідувач може збільшити на сторінці. 1.0 не збільшує масштаб. |
максимальний масштаб | Максимальна сума, яку відвідувач може збільшити на сторінці. 1.0 не збільшує масштаб. |
масштабована користувачем | Дозволяє пристрою збільшувати та зменшувати масштаб. Значення - так чи ні. |
Зазвичай рекомендується не запобігати масштабуванню, оскільки це дратує і потенційно є проблемою доступності.
Ви, ймовірно, захочете це також у своєму CSS:
@-ms-viewport( width: device-width; )
Корисно знати: зміна значення цього мета-тегу за допомогою JavaScript працює, сторінка відреагує на нове значення. Або витягніть весь тег, і замініть, або змініть content
властивість. Не надто поширена потреба, але вона може виникнути.