Media

CSS daje możliwość zdefiniowania osobnych styli, w zależnosci od tego na jakim urządzeniu strona będzie oglądana.

Wybór medium

Medium można wybrać przy pomocy polecenia @media

@media print
{
    body { font-size: 10pt }
}

@media screen
{
    body { font-size: 12pt }
}

@media screen, print
{
    body { line-height: 1.2 }
}

lub definiując je w tagu <link> - odnośnik

<link rel="stylesheet" type="text/css" media="print, handheld" href="styl.css"> ```

Typy mediów

all - Dla wszystkich urządzeń.</li> aural - Syntezatory mowy (słuchowe arkusze stylów).</li> braille - Urządzenia do czytania braillem (dla niewidomych).</li> embossed - Drukarki brailla.</li> handheld - Urządzenia ręczne (zwykle mały ekran, czarno-białe, ograniczone pasmo).</li> print - Materiały drukowane nieprzezroczyste i podgląd wydruku.</li> projection - Prezentacje projektorowe lub nadruki na folii rzutnikowej.</li> screen - Kolorowy ekran komputerowy.</li> tty - Media używające siatki o stałej szerokości znaków jak dalekopisy, terminale lub przenośne urządzenia z ograniczonymi możliwościami wyświetlania.</li> tv - Odbiorniki telewizyjne (niska rozdzielczość, kolor, ograniczone przewijanie, dostępny dźwięk).</li> </ul>

Grupy mediów

Różne media "nakładają się" na siebie, dlatego można zamiast wymieniać ich typy, używać grup mediów:

continuous - Media "ciągłe" - nie podzielone na strony (aural, braille, handheld, screen, tty, tv)</li> paged - Podział na strony (embosssed, handheld, print, projection, tv)</li> visual - Wizualne (handheld, print, projection, screen, tty, tv)</li> aural - Słuchowe (aural, tv)</li> tactile - Dotykowe (braille, embossed)</li> grid - Urządzenia używające siatki o stałej szerokości znaku (braille, embossed, handheld, tty)</li> bitmap - Mapa bitowa (handheld, print, projection, screen, tv)</li> interactive - Interaktywne (aural, braille, embossed, handheld, screen, tty, tv)</li> static - "Statyczne" - nieinteraktywne (aural, braille, embossed, handheld, print, projection)</li> all - Wszystkie (all)</li> </ul>