Atribut media HTML
Definisi dan Penggunaan
Atribut media
menentukan media/perangkat apa yang dioptimalkan untuk dokumen tertaut.
Atribut ini digunakan untuk menentukan bahwa URL target dirancang untuk perangkat khusus (seperti iPhone), ucapan, atau media cetak.
Atribut ini dapat menerima beberapa nilai.
Berlaku untuk
Atribut media
dapat digunakan pada elemen berikut:
Elemen | Atribut |
---|---|
<a> | media |
<area> | media |
<tautan> | media |
<sumber> | media |
<gaya> | media |
Contoh
Sebuah Contoh
Tautan dengan atribut media:
<a href="att_a_media.asp?output=print"
media="print and (resolution:300dpi)">
Open media attribute page for print.</a>
Contoh Daerah
Peta gambar, dengan area yang dapat diklik:
<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>
Contoh Tautan
Dua lembar gaya berbeda untuk dua jenis media berbeda (layar dan cetak):
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>
Contoh Sumber
Penggunaan atribut media:
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
Contoh Gaya
Tentukan gaya yang akan digunakan untuk mencetak:
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>
Dukungan Peramban
Atribut media
memiliki dukungan browser berikut untuk setiap elemen:
Element | |||||
---|---|---|---|---|---|
a | Yes | Yes | Yes | Yes | Yes |
area | Yes | Yes | Yes | Yes | Yes |
link | Yes | Yes | Yes | Yes | Yes |
source | Not supported | Not supported | Not supported | Not supported | Not supported |
style | Yes | Yes | Yes | Yes | Yes |