Атрибут media

Оновлено: 13.01.2023

Атрибут media

Встановлює пристрій для виводу, для якого призначена таблиця стилів. Для кожного пристрою можна визначити свій стиль, який би враховував специфіку пристрою і підганяв під нього вигляд вебсторінки.

Синтаксис

<style media="all | print | screen | speech">
 ...
</style>

Значення

all Усі пристрої.
print Друкуючий пристрій на кшталт принтера.
screen Екран монітора.
speech Мовні синтезатори та програми для відтворення тексту вголос. Сюди входять мовні браузери.

Можна встановлювати відразу кілька значень, перераховуючи їх через кому.

Значення за замовчуванням

screen

Приклад

<!DOCTYPE HTML>
<html>
  <head>
   <metacharset="utf-8">
   <title>STYLE, media attribute</title>
   <style media="screen">
     .window {
      background: #333;
      border: 1px solid red;
      font-size: 0.9em
      color: #fc0;
      padding: 10px
     }
   </style>
   <style media="print">
     .window {
      border: 1px solid black;
      font-family: Arial;
      font-size: 0.9em
      color: black;
      padding: 10px
     }
   </style>
  </head>
  <body>
    <div class="window">
    The veterinary certificate includes an excursion ephemeroid,
    but establishments of this kind are especially popular,
    concentrated in the area of the Central Square and the railway station.
    </div>
  </body>
</html>

Браузери

style:media

Переглянути сумісність з Can I use?

style:media