tutorial pengembangan web terbaru
 

HTML <link> media Attribute

<HTML <link> tag

Contoh

Dua style sheet yang berbeda untuk dua jenis media yang 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>
Cobalah sendiri "

Definisi dan Penggunaan

The media atribut menentukan apa yang media / perangkat sumber daya target dioptimalkan untuk.

Atribut ini sebagian besar digunakan dengan stylesheet CSS untuk menentukan gaya yang berbeda untuk jenis media yang berbeda.

The media atribut dapat menerima beberapa nilai.


Dukungan Browser

Atribut
media iya nih iya nih iya nih iya nih iya nih

Perbedaan Antara HTML 4.01 dan HTML5

The media atribut sekarang mendukung nilai-nilai lebih.


Sintaksis

<link media="value">

kemungkinan Operators

Nilai Deskripsi
and Menentukan operator AND
not Menentukan operator NOT
, Menentukan operator OR

perangkat

Nilai Deskripsi
all Default. Cocok untuk semua perangkat
aural synthesizer pidato
braille perangkat umpan balik braille
handheld perangkat genggam (layar kecil, bandwidth terbatas)
projection proyektor
print Pratinjau cetak modus / halaman yang dicetak
screen layar komputer
tty Teletypes dan media yang sama menggunakan karakter jaringan fixed-pitch
tv Jenis televisi perangkat (resolusi rendah, kemampuan gulir terbatas)

Nilai

Nilai Deskripsi
width Menentukan lebar area layar yang ditargetkan.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (min-width:500px)"
height Menentukan ketinggian area tampilan yang ditargetkan.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (max-height:700px)"
device-width Menentukan lebar target display / kertas.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (device-width:500px)"
device-height Menentukan tinggi dari target display / kertas.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (device-height:500px)"
orientation Menentukan orientasi target display / kertas.
Kemungkinan nilai: "portrait" atau "landscape"
Contoh: media="all and (orientation: landscape)"
aspect-ratio Menentukan rasio lebar / tinggi dari area tampilan yang ditargetkan.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio Menentukan rasio perangkat-lebar / perangkat-tinggi dari target display / kertas.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (aspect-ratio:16/9)"
color Menentukan bit per warna layar sasaran.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (color:3)"
color-index Menentukan jumlah warna tampilan sasaran dapat menangani.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (min-color-index:256)"
monochrome Menentukan bit per pixel dalam frame buffer monokrom.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="screen and (monochrome:2)"
resolution Menentukan kepadatan pixel (dpi atau dpcm) dari target display / kertas.
"min-" dan "max-" awalan dapat digunakan.
Contoh: media="print and (resolution:300dpi)"
scan Menentukan metode pemindaian dari layar tv.
Nilai yang mungkin adalah "progressive" dan "interlace" .
Contoh: media="tv and (scan:interlace)"
grid Menentukan jika perangkat output jaringan atau bitmap.
Nilai yang mungkin adalah "1" untuk grid, dan "0" jika tidak.
Contoh: media="handheld and (grid:1)"

<HTML <link> tag