Örnek
İki farklı medya türleri için iki farklı stil sayfalarını (screen and print) :
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>
Kendin dene " Tanımı ve Kullanımı
media nitelik hedef kaynak için optimize ne medya / aygıtını belirtir.
Bu nitelik çoğunlukla farklı medya türleri için farklı stiller belirtmek için CSS stil kullanılır.
media nitelik çeşitli değerleri kabul edebilir.
Tarayıcı Desteği
| nitelik | |||||
|---|---|---|---|---|---|
| media | Evet | Evet | Evet | Evet | Evet |
HTML 4.01 ve HTML5 Arasındaki Farklar
media nitelik şimdi daha değerleri destekler.
Sözdizimi
<link media=" Olası Operators değer Açıklama and VE operatörünü belirtir not bir operatörleri belirtir , OR operatörünü belirtir
Cihazlar
değer Açıklama all Varsayılan. Tüm cihazlar için uygundur aural sentezleyici braille Braille geri besleme elemanları handheld El cihazları (small screen, limited bandwidth) projection Projektörler print Baskı önizleme modu / yazdırılan sayfalar screen Bilgisayar ekranları tty sabit harfleri dizebilen Teletypes ve benzeri ortam tv Televizyon tipi cihazlar (low resolution, limited scroll ability)
Değerler
değer Açıklama width Hedeflenen görüntüleme alanının genişliğini belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (min-width:500px)" height Hedeflenen görüntüleme alanının yüksekliğini belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (max-height:700px)" device-width Hedef görüntü / kağıt genişliğini belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (device-width:500px)" device-height Hedef ekran / kağıdın yüksekliğini belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (device-height:500px)" orientation Hedef ekran / kağıdın yönünü belirtir.
Olası değerler: "portrait" veya "landscape"
Örnek: media="all and (orientation: landscape)" aspect-ratio hedeflenen görüntüleme alanının genişlik / yükseklik oranını belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (aspect-ratio:16/9)" device-aspect-ratio Hedef görüntü / kağıt aygıt genişliği / aygıt yükseklik oranını belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (aspect-ratio:16/9)" color Hedef ekranın renk başına bit belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (color:3)" color-index Hedef ekran işleyebilir renk sayısını belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (min-color-index:256)" monochrome Tek renkli bir çerçeve tampon piksel başına bit belirtir.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="screen and (monochrome:2)" resolution Piksel yoğunluğunu belirler (dpi or dpcm) hedef görüntüleme / kağıt.
"min-" ve "max-" önekleri kullanılabilir.
Örnek: media="print and (resolution:300dpi)" scan tv ekranın tarama yöntemini belirtir.
Olası değerler "progressive" ve "interlace" .
Örnek: media="tv and (scan:interlace)" grid Çıkış cihazı ızgara veya bitmap olup olmadığını belirtir.
Olası değerler "1" ızgara ve "0" , aksi.
Örnek: media="handheld and (grid:1)"