CSS class versus id

CSS class versus id

Další jedna z prvních věcí, které by měl vědět každý kdo používá CSS. Jaký je tedy rozdíl deklarace class oproti id. Odpověď je naprosto jednoduchá, liší se ve formě zápisu a samozřejmě i v použití.
Podstatná informace je také ta, že pokud použijete id, pak odkaz v těle dokumentu by měl být pouze jednou. Pokud se budete odkazovat vícekrát technicky to fungovat bude, ovšem html validátor vám dá jasně najevo co si o tom myslí.

První možností je tedy id, v css souboru označíte #.
příklad:

#odstavec {
color: red;
}

Následně můžete použít v html:

<p id="odstavec">
text
</p>

Druhá možnost je tedy class, v css souboru označíte tečkou.

příklad:

p.odstavec {
color: red;
}

Následně můžete použít v html:

<p class="odstavec">
text
</p>

Podle dostupných informací se ID používá pro identifikaci ve scriptech, to asi dává i trochu smysl. Nicméně já osobně používam pouze deklarace formou class, mám alespoň trochu jistotu, že pokud se mi podaří omylem odkázat v těle html na styl 2x, budu z pohledu validátoru v pohodě. Další věc je to, že mám rád určitý systém a je pro mou osobu přehlenější když je všechno definováno jednotně. Jen jsem tedy v minulosti narazil na prazvláštní nefunkčnost deklarace class v tabulkách, speciálně tuším problém v <td>. Nicméně nedávno jsem byl donucen situací použít tabulku a k mému překvapeni jsem zjistil, že class již funguje i v tabulkách. Nejsem si úplně jist, zda ve všech browserech. Firefox, IE, a CHROME s tím problém neměl.