Home >> CSS návod >> CSS Třídy (Class)

CSS Třídy (Class)

V CSS je velmi jednoduché nastavit například červenou barvu pro všechny nadpisy typu h1 na vašich stránkách. Ale co když potrebujete půlku nadpisů zeleně? Nejjjednodušší je použít CSS třídy (CSS classes).

Zápis kódu CSS třídy

Každá CSS třída začíná tečkou (.) po které následuje jméno třídy. Jméno si můžete zvolit dle libosti. Za jménem již píšete atributy a příslušné hodnoty.

Příklad zápisu:


.jméno-třídy { atribut: hodnota; }

Pokud chcete použít stejné jméno třídy pro více elementů, ale každý v jiném stylu. Jednoduše před tečku napište Vámi požadovaný HTML element - v našem případě pro odstavec tedy p.


p.jméno-třídy { atribut: hodnota; }

Příklad užití CSS tříd


<head>

<style type="text/css">

h1.cervene { color:red; }

p.malepismo { font-size: 9px; color: green; }

</style>

</head>

<body>

<h1 class="cervene">CSS třída</h1>

<p class="malepismo">CSS třídy mohou být velmi užitečné!</p>

</body>

Výsledek:

CSS třída

CSS třídy mohou být velmi užitečné!

Další lekce >>

<< Předchozí lekce