HTML Тег <style> атрибут media
Пример
Укажите стиль, используемый для печати:
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>
Попробуйте сами »
Определение и использование
Атрибут media указывает, для какого носителя/устройства оптимизирован стиль CSS.
Атрибут media используется для указания того, что стиль предназначен для специальных устройств (например, iPhone), речевых или печатных носителей.
Совет: Атрибут media может принимать несколько значений.
Поддержка браузеров
Атрибут | |||||
---|---|---|---|---|---|
media | Да | Да | Да | Да | Да |
Синтаксис
<style media="value">
Возможные операторы
Значение | Описание |
---|---|
and | Определяет AND оператор |
not | Определяет NOT оператор |
, | Определяет OR оператор |
Устройства
Значение | Описание |
---|---|
all | Подходит для всех устройств. Это значение по умолчанию |
aural | Синтезатор речи |
braille | Устройства обратной связи по Брайлю |
handheld | Портативные устройства (маленький экран, ограниченная пропускная способность) |
projection | Проекторы |
Режим предварительного просмотра печати/печатные страницы | |
screen | Экран компьютера |
tty | Телетайпы и аналогичные носители, использующие сетку символов с фиксированным шагом |
tv | Устройства телевизионного типа (низкое разрешение, ограниченная возможность прокрутки) |
Значения
Значение | Описание |
---|---|
width | Задает ширину целевой области отображения. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (min-width:500px)" |
height | Задает высоту целевой области отображения. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (max-height:700px)" |
device-width | Задает ширину целевого дисплея/бумаги. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (device-width:500px)" |
device-height | Задает высоту целевого дисплея/бумаги. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (device-height:500px)" |
orientation | Указывает ориентацию целевого дисплея/бумаги. Возможное значение: "portrait" или "landscape" Пример: media="all and (orientation: landscape)" |
aspect-ratio | Задает соотношение ширины и высоты целевой области отображения. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (aspect-ratio:16/9)" |
device-aspect-ratio | Задает соотношение ширины устройства/высоты устройства целевого дисплея/бумаги. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (aspect-ratio:16/9)" |
color | Задает количество бит на цвет целевого дисплея. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (color:3)" |
color-index | Задает количество цветов, которые может обрабатывать целевой дисплей. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (min-color-index:256)" |
monochrome | Задает биты на пиксель в монохромном буфере кадров. "min-" и "max-" можно использовать префиксы. Пример: media="screen and (monochrome:2)" |
resolution | Задает плотность пикселей (dpi или dpcm) целевого дисплея/бумаги. "min-" и "max-" можно использовать префиксы. Пример: media="print and (resolution:300dpi)" |
scan | Задает способ сканирования телевизионного дисплея. Возможные значения "progressive" и "interlace". Пример: media="tv and (scan:interlace)" |
grid | Задает, является ли устройство вывода сеточным или растровым. Возможные значения для сетки "1" и иначе "0". Пример: media="handheld and (grid:1)" |
❮ HTML <style> тег