Jenis media yang memungkinkan Anda untuk menentukan bagaimana dokumen akan disajikan dalam media yang berbeda. Dokumen dapat ditampilkan berbeda pada layar, di atas kertas, dengan browser aural, dll
Jenis Media
Beberapa properti CSS hanya dirancang untuk media tertentu. Sebagai contoh “suara-keluarga” properti dirancang untuk agen pengguna aural. Beberapa sifat lainnya dapat digunakan untuk jenis media yang berbeda. Misalnya, “font-size” properti bisa digunakan untuk kedua layar dan media cetak, tapi mungkin dengan nilai yang berbeda. Sebuah dokumen biasanya membutuhkan lebih besar font-size di layar daripada di atas kertas, dan sans-serif font yang mudah dibaca di layar, sementara serif font yang mudah dibaca di atas kertas.
Peraturan Media
Aturan media memungkinkan aturan style yang berbeda untuk media yang berbeda dalam style sheet yang sama.
Gaya dalam contoh di bawah ini memberitahu browser untuk menampilkan 14 piksel font Verdana di layar. Tetapi jika halaman dicetak, maka akan dalam font 10 Times, piksel. Perhatikan bahwa font-weight diatur untuk berani, baik di layar dan di atas kertas:
<html>
<head>
<style>
@media screen
{
p.test {font-family:verdana,sans-serif;font-size:14px;}
}
@media print
{
p.test {font-family:times,serif;font-size:10px;}
}
@media screen,print
{
p.test {font-weight:bold;}
}
</style>
</head><body>
….
</body>
</html>
Lihat saja sendiri! Jika Anda menggunakan Mozilla / Firefox atau IE5 + dan mencetak halaman ini, Anda akan melihat bahwa ayat di bawah “Jenis Media” akan ditampilkan dalam huruf lain, dan memiliki ukuran font yang lebih kecil dari sisa teks.
Berbeda Jenis Media
Catatan: Nama jenis media yang tidak case-sensitive.
