Pro výukové účely na SPŠ Zlín
vytvořil RNDr.Vladimír Vaščák

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í

1. Přímo vložený styl

Zapisujeme přímo do značky a platí tedy pouze pro tuto značku.

Příklad použití:

Zápis:
<h3 style="color: red"> červený nadpis </h3> 
Se zobrazí jako:

červený nadpis

Úkol: vložte zelený nadpis: ZDE

2. Šablona stylu v dokumentu

Šablonu zapisujeme do záhlaví.

Příklad použití:
<style type="text/css">
<!--
    h3 { color: blue;}
    h5 { color: green;}
-->
</style>
Potom v tělu dokumentu stačí napsat:
<h5> zelený nadpis </h5>
který zobrazí jako:
zelený nadpis
Úkol: vložte modrý nadpis <h3>: ZDE

3. Externí šablony stylů

Šablonu zapisujeme do textového souboru s příponou css .

Příklad použití:
1. Nejdříve vytvoříme soubor pokus.css :
samp {color:hotpink;}
2. Do hlavičky napíšeme:
<link rel="stylesheet" type="text/css" href="pokus.css">
nebo
<style>
<!--
    @import url(pokus.css);
-->
</style>
3. Potom stačí v těle dokumetu napsat:
<samp>ahoj</samp>
což se zobrazí jako ahoj
Poznámka: rozdíly při použití jednoho stylu v dokumentu nejsou.
vpřed
© 2007 Pro výuku na SPŠ Zlín připravil RNDr. Vladimír Vaščák