Úloha

Zadání (kontext úlohy)

Otestuj, jak funguje kaskádování v CSS:

  • Definuj pro jeden prvek více stylů (např. barvu písma v <p>) přes selektor p, .class i #id.

  • Porovnej, který styl se nakonec použije.

  • Vyzkoušej také použití !important.

Cíl úlohy

Porozumíš pravidlům kaskádování a specifikace v CSS a naučíš se určovat, který styl má při konfliktu přednost.

Vstupní podmínky

  • Máš k dispozici HTML dokument, který obsahuje alespoň jeden prvek (např. <p>), jenž má:

    • přiřazený atribut id,

    • přiřazenou class,

    • a je přístupný také jako prostý elementový selektor (např. p).

  • Pracuješ se souborem styles.css, do kterého budeš zapisovat různá pravidla pro tento prvek.

Požadovaný výstup

  • Popíšeš, který styl má přednost a proč.

  • Demonstruješ vliv direktivy !important na výsledný vzhled.

Soubory

Odkaz na css soubor
Odkaz na html soubor