Kaskádové styly ­ CSSKaskádové styly ­ CSS Cascade Style Sheets ­ definice vzhledu dokumentu pomocí parametrů DTP Kaskády stylů ­ vnější styly ­ vnitřní styly ­ styly specifické pro element Syntaxe CSSSyntaxe CSS výběr_značky {výčet_vlastností } výběrové pravidlo ,,CO" se bude formátovat formátovací pravidla ,,JAK" se bude formátovat Výběrová pravidlaVýběrová pravidla ­ značky oddělené čárkou h1, h2, h3 {color:darkblue} Společné vlastnosti více značek Výběr vnořených značek ­ značky oddělené mezerou p sub {font-size: 60%} Výběr jedné značky h1 {color: white; font-size: 200%} Vnitřní stylyVnitřní styly Vložené styly v dokumentu Specifické styly Vnější stylyVnější styly doc1.html doc2.html doc3.html styly.css ­ stejné formátování více dokumentů Vnější stylyVnější styly doc1.html doc2.html doc3.html styly / styly.css Třídy v CSSTřídy v CSS ­ označení skupiny stejně formátovaných elementů

...

...

...

p.prvni {text-indent: 2em} em.modry {font-style:normal; color:blue} .tuc {font-weight:bold} .kur {font-style: italic} .varovani {border: 2px solid red} Formátovací styly Označení v dokumentu Vybrané vlastnosti textuVybrané vlastnosti textu color: yellow background-color: #0033cc border-color: red Barvy font-family: Arial, sans-serif font-size: 70% font-weight: bold text-decoration: underline text-align: left|right|center|justify Vlastnosti písma barva písma barva pozadí barva okraje rodina písma velikost písma tloušťka písma podtržený text zarovnání textu Vybrané vlastnosti blokůVybrané vlastnosti bloků width: 35em height: 15em Velikost padding-bottom: 0.3em margin-right: 3ex Odsazení a okraje šířka bloku výška bloku odsazení textu dole šířka okraje bloku vpravo border-width: 2px border-style: outset Orámování šířka rámečku styl rámečku Jednotky velikostiJednotky velikosti 1pt 1px Absolutní jednotky 1em 1en 1ex 70% Relativní jednotky typografický bod (0,3528 mm) pixel (obrazovkový bod) šířka písmene ,,M" šířka písmene ,,N" šířka písmene ,,x" procenta ­ styly pro tisk ­ styly pro zobrazení na obrazovce Odsazení a rozměryOdsazení a rozměry Text v elementu padding-bottom margin-top border width height padding-top padding-left padding-right Zarovnání textu v blokuZarovnání textu v bloku Text Text Text Text Text Text Text Text Text text-align: center rightleft vertical-align: top middle bottom Vlastnosti pozadíVlastnosti pozadí background-color background-image background-repeat background-attachment background-position barva pozadí obrázek na pozadí opakování obrázku na pozadí posun obrázku při posuvu stránky pozice obrázku na pozadí background-color:darkred; background-image: url(obrazky/pozadi.jpg); background-repeat:repeatX; background-attachment: scroll; background-position: center;