ширина-устройства

Устаревший: Данная функция больше не рекомендуется. Хотя некоторые браузеры могут её поддерживать, она может быть удалена из соответствующих веб-стандартов, может быть в процессе удаления или поддерживаться только для совместимости. Избегайте её использования и, если возможно, обновите существующий код; обратитесь к таблице совместимости внизу этой страницы для принятия решения. Помните, что эта функция может перестать работать в любой момент.

Примечание: Для запроса ширины области просмотра разработчики должны использовать свойство width вместо этого.

Свойство device-width CSS сред можно использовать для проверки ширины поверхности рендеринга устройства вывода.

Синтаксис

Функция device-width задаётся как значение <length>. Это свойство диапазона, что означает, что вы также можете использовать префиксные min-device-width и max-device-width варианты для запроса минимальных и максимальных значений соответственно.

Примеры

Применение специального стилизованного листа для устройств, чья ширина меньше 800 пикселей

<link
  rel="stylesheet"
  media="screen and (max-device-width: 799px)"
  href="http://foo.bar.com/narrow-styles.css" />

Спецификации

Спецификация
Уровень 4 запросов к медиа # ширина-устройства
Уровень 4 запросов к медиа # ширина-устройства

Совместимость с браузерами

	Рабочий стол					Мобильный
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на IOS	Samsung Internet	WebView Android
`device-width`	1	12	2	10	3	18	4	10.1	1	1.0	≤37

См. также

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/@media/device-width