Определение и использование
media атрибут определяет , какие средства массовой / устройство связанный документ оптимизирован для.
Этот атрибут используется для указания того, что целевой URL предназначен для специальных устройств (например, iPhone), речи или печатных средств массовой информации.
Этот атрибут может принимать несколько значений.
Относится к
media атрибут может быть использован на следующих элементах:
| элементы | Атрибут |
|---|---|
| <a> | media |
| <area> | media |
| <link> | media |
| <source> | media |
| <style> | media |
Примеры
Пример
Ссылка с media - атрибута:
<a href="att_a_media.asp?output=print"
media="print and (resolution:300dpi)">
Open media attribute page for print.</a>
Попробуй сам " Area Пример
Изображения на карте, с интерактивными области:
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun"
href="sun.htm" media="screen and (min-color-index:256)">
</map>
Попробуй сам " Link Пример
Два разных таблиц стилей для двух различных типов носителей (экран и печать):
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>
Попробуй сам " Source Пример
Использование в media - атрибута:
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
Попробуй сам " Style Пример
Укажите стиль использовать для печати:
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style> Попробуй сам " Поддержка браузеров
media атрибут имеет следующую поддержку браузера для каждого элемента:
| Элемент | |||||
|---|---|---|---|---|---|
| a | да | да | да | да | да |
| area | да | да | да | да | да |
| link | да | да | да | да | да |
| source | Не поддерживается | Не поддерживается | Не поддерживается | Не поддерживается | Не поддерживается |
| style | да | да | да | да | да |