media özelliği, CSS stil şablonlarının geçerli olacağı hedef medyanın (ortamın vs.) belirlenmesini sağlar. Virgül ile ayrılarak birden fazla ortam değeri belirtilebilir. Varsayılan değerinin screen
olması ile beraber bazı tarayıcılar all
değerini kullanır.
HTML Sözdizimi
<element media="ortam" > ... </element>
JavaScript & DOM Sözdizimi
<script type="text/javascript">
ortam = element.media
</script>
ortam | screen, print veya all değerlerinden bir veya ikisini alarak stil şablonlarının geçerli olacağı/uygulanacağı medyayı belirtir. Alttaki değerler ile birlikte CSS 2 önergesinde aşağıdaki listede gösterilen ortam tipleri de eklenmiştir.
- screen : Değerler ekranda gösterilecek içeriğe uygulanır.
- print : Değerler yazıcı önizleme modunda gösterilecek veya yazdırılacak içeriğe uygulanır.
- all : Değerler tüm ortamlara uygulanır.
|
Dönüş Değeri
ortam | Stil şablonlarının uygulandığı medya ismi döner. |
CSS 2 önergesinde tanımlanan medya tipleri
- all
- aural
- braille
- embossed
- handheld
- print
- projection
- screen
- tty
- tv
Örnek
Aşağıdaki örnek, STYLE etiketinin media özelliği kullanılarak biri ekran diğeri yazıcı için geçerli iki stil kuralının tanımlanmasını göstermektedir.
<style type="text/css" media="screen">
#menu {
display : block;
}
</style>
<style type="text/css" media="print">
#menu {
display : none;
}
</style>
Elementler
media özelliğinin kullanıldığı HTML etiketleri/elementleri
STYLE | LINK