More classes, more problems
Un element HTML poate avea mai multe clase setate pe el, precum primul paragraf.
<p class="subtitlu alta-clasa">Subtitlul paginii care este albastru.</p>
Dar noi cand scriem un selector nu trebuie sa scriem toate clasele acelui element. Printr-un selector noi ne adresam oricarui element ce contine acea clasa, nu unui element anume.
Un element va folosi regulile CSS fiecarei clase care o contine.
De exemplu, clasa subtitlu
ii schimba culoarea textului, iar clasa alta-clasa
ii ofera o margine inferioara mai mare.
Asadar un element poate avea mai multe reguli CSS din mai multe locuri.
Probleme pot aparea cand doua clase diferite vor sa seteze aceeasi proprietate.
In acel caz nu conteaza unde este situata clasa in interiorul atributului class=""
, ci conteaza ordinea in care sunt scrisi selectorii.
Daca vom adauga o noua clasa primului paragraf, si apoi vom scrie un nou selector pentru acea clasa, care adauga o noua margine inferioara, atunci acea margine va fi cea finala.
Cand avem un conflict intre reguli, ultima regula intalnita este cea care castiga.
ultima-clasa
si apoi scrie un nou selector pentru aceasta care adauga regula margin-bottom: 0;
.