Ionut Stoica

Programator PHP / Frontend developer / Pasionat de Electronica Auto
20Nov

CSS Specificity – Ordinea de aplicare a regulilor CSS

Ok, sa incepem cu inceputul.
CSS (Cascading Style Sheet) este un limbaj de definitie a modului de afisare al unui element in pagina.

Notiunea de “Specificity” se refera la modul in care sunt aplicate regulile intr-o pagina. In principiu regula aplicata est ultima regula definita, dar nu este doar atat.
In CSS fiecare tip de proprietate are o anumita “greutate”. Prin calcularea “greutatii” unei reguli se afla specificitatea acelei reguli.

Asadar, tag-urile HTML au greutatea “1”, id-urile au greutatea “100” iar clasele au greutatea “10”. Regulile aplicate global au greutatea 0.

<pre lang=”css”>
div .stil1l1.stil2 { padding:50px; }
</pre>
Are specificitate 1 + 10 + 10 = 21
<pre lang=”css”>
div .stil1l1 { padding:100px; }
</pre>
Are specificitate 1 + 10 = 11, deci nu va fi aplicat decat daca este marcat ca important.
<pre lang=”css”>
form#formularul-meu { … }
</pre>
Are specificitatea 1 + 100 = 101. Continutul acestei reguli va suprascrie toate regulile definite anterior pentru acel element.

Va urma…

Comments(0)

Leave a comment

Your email address will not be published.Field is required

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

 Previous  All works Next