CSS

1. Přímo vložený styl
2. Šablona stylu v dokumentu
3. Externí šablony stylů
4. Syntaxe stylů
5. Třídy stylů
6. Vlastnosti písma
7. Vlastnosti barvy a pozadí
8. Vlastnosti textu
9. Vlastnosti obdelníku
10. Vlastnosti seznamů
11. Značky <style>, <span> a <div>
12. Vlastnosti zobrazení

5. Třídy stylů

• Styl značky
  

p {color: violet}

• Styly pro stejnou značku rozlišíme následovně (regulérní třídy)
  

p.cerveny {color: red}
p.modry {color: blue}
p.zeleny {color: green}

<p>fialový odstavec</p>
<p class="cerveny">červený odstavec</p>
<p class="modry">modrý odstavec</p>
<p class="zeleny">zelený odstavec</p>

fialový odstavec

červený odstavec

modrý odstavec

zelený odstavec

• Generické třídy

.velky {font-size: 200%}

<p class="velky">Velký odstavec</p>

Velký odstavec

• Hypertextové odkazy

• nenavštívený odkaz a:link
• pravě navštívený odkaz a:active
• navštívený odkaz a:visited

a:link {color: blue}
a:active {color: red}
a:visited {color: green}

• Interakce

• přejetí kurzorem :hover
• aktivace např. klávesou TAB ve formuláři :focus

a:hover {color: yellow}