opis | |
---|---|
@media Media types { } | Reguła definiuje style CSS |
@import URL | url() Media types | Reguła importuje style CSS |
<link; source; style media="Media types" src... | Atrybut łączy plik styli CSS |
Typ | Opis |
---|---|
all | Dla wszystkich urządzeń. |
braille | Dla dotykowych urządzeń (sprzężenia zwrotnego) Braille'a. |
embossed | Dla stronicowych drukarek Braille'a. |
handheld | Dla urządzeń kieszonkowych |
Dla materiałów i dokumentów przeglądanych na ekranie w trybie podglądu wydruku. | |
projection | Dla prezentacji prezentowanych np. za pomocą rzutników. |
screen | Przede wszystkim dla kolorowych monitorów komputerowych. |
speech | Dla syntezatorów mowy. |
tty | Dla mediów używających stałej siatki znaków. |
tv | Dla odbiorników telewizyjnych |
Uwagi:
Typy mediów w liście odzielamy przecinkami.
Plik styl.css zawiera kod:
h1 {color: silver;}
Grupa | Opis |
---|---|
I | ciągłe/stronicowane |
II | wizualne/dźwiękowe/mowa/dotykowe |
III | siatka/bitmapa |
IV | interaktywne/statyczne |
Zależność | Grupy | |||
---|---|---|---|---|
Typy | I | II | III | IV |
braille | ciągłe | dotykowe | siatka | oba |
embossed | stronicowane | dotykowe | siatka | statyczne |
handheld | oba | wizualne. dźwiękowe, mowa | oba | oba |
stronicowane | wizualne | bitmapowe | statyczne | |
projection | stronicowane | wizualne | bitmapowe | interaktywne |
screen | ciągłe | wizualne, audio | bitmapowe | oba |
speech | ciągłe | mowa | nie dotyczy | oba |
tty | ciągłe | wizualne | siatka | oba |
tv | oba | wizualne, audio | bitmapowe | oba |
Operator | Opis |
---|---|
, | separator oraz logiczne lub |
and | logiczne i |
not | logiczne nie |
only | tylko |
Prefiks, cecha, wartość | Opis |
---|---|
([min-|max-]width:length) | szerokość |
([min-|max-]height:length) | wysokość |
([min-|max-]device-width:length) | szerokość ekranu |
([min-|max-]device-height:length) | wysokość ekranu |
(orientation:[portrait | landscape]) | orientacja pionowa lub pozioma |
([min-|max-]aspect-ratio:ratio) | proporcje strony |
([min-|max-]device-aspect-ratio:ratio) | proporcje ekranu |
([min-|max-]color:integer) | kolor |
([min-|max-]color-index:integer) | ilość kolorów |
([min-|max-]monochrome:integer) | monochromatyczny |
([min-|max-]resolution:resolution) | rozdzielczość |
(scan: [progressive | interlace]) | skanowanie (dotyczy TV) |
(grid:integer) | siatka |
Wartość | Opis |
---|---|
length | liczba z jednostką |
portrait | orientacja pionowa |
landscape | orientacja pozioma |
ratio | ułamek (proporcja) z symbolem "/"* |
integer | liczba całkowita |
resolution | liczba z jednostką rozdzielczości (dpi|dpcm)* |
progressive | progresywny |
interlace | z przeplotem |
Uwagi:
Skrót RWD (ang. Responsive Web Design) określa techniki tworzenia stron internetowych, których układ automatycznie dostosowuje do rozdzielczości ekranu. Nie jest to termin normatywny.