Nu de mult va spuneam ca am sa revin putin la selectorii de tip CLASS si ID, deoarece nu e chiar tot una care dintre ei sunt folositi, iar daca sunteti incepatori in ai CSS-ului, e bine de stiut care este diferenta dintre cei doi.
In primul rand, ID-urile se pot folosi doar o singura data intr-un document html. CLASS-urile se pot folosi de mai multe ori. In general, ID-urile se folosesc pentru elementele principale ale unei pagini, de exemplu header-ul, continutul principal, elementele din subsolul paginii (footer), etc. Selectorii de tip CLASS se folosesc pentru elementele care apar de mai multe ori intr-un fisier html sau intr-un document (la meniuri de exemplu).
In al doilea rand, e bine de stiut ca ID-urile vor fi intotdeauna prioritare fata de selectorii de tip CLASS.
<style type="text/css">
#verde {color:green}
.rosu {color:red}
</style>
<body>
<p id="verde">rand pentru ID verde</p>
<p class="rosu">rand pentru CLASS rosu</p>
<p id="verde" class="rosu">rand pentru ID si CLASS combinat</p>
</body>
Codul de mai sus va avea urmatorul efect:
rand pentru ID verde
rand pentru CLASS rosu
rand pentru ID si CLASS combinat
Mai exact, in primul rand am setat un ID pentru un font verde si s-a afisat verde, apoi un CLASS pentru un font rosu si se afiseaza rosu, iar in ultimul rand le-am introduse pe amandoua. Se vede insa in rezultat ca doar ID-ul are efect, din moment ce randul este in afisat in verde. In practica, e bine sa nu se procedeze astfel, mai sus fiind doar un exemplu. Cei doi selectori trebuiesc folositi separat pentru elementele html dintr-o pagina.