Definirea și redefinirea valorilor pentru elementele de pagină de proprietăți diferite, trebuie să înțelegem ce fel de valoare va folosi browser-ul și modul în care va fi îndrumat.
CSS funcționează o regulă: selectorul mai specific determină elementul, cu atât mai mare probabilitatea ca acesta se va aplica.
Cu cât este mai specifică un selector este legat de stil, deci este mai puternic.
specificitatea
Comparați, de exemplu, un selector și selector pentru eticheta pe identificatorul.
Prima probă este foarte frecvente - conține toate elementele de acest tip pe pagină, al doilea eșantion va primi doar un singur element specific, pe care noi se pare că știm bine. Din moment ce am lucrat atât de specifica elementul pe care dorim să atragem, atunci într-adevăr el trebuie să fie proiectate astfel încât.
Și astfel încât să putem redefini cu ușurință link-uri-stil specific, în același timp, fără a afecta celelalte. Acest lucru se datorează faptului că selectorul mai specifică ID-ul de pe selectorul de tag-ul. și, prin urmare, mai puternic decât el și poate bloca mina de acțiune.
Să ne aranja selectorii pentru a crește specificitatea lor:
- tag - selector mai puțin specifică. Nu avem nevoie să faceți nimic pentru a selecta un element de pe eticheta sau adăugați-l la clasa, sau pentru a atribui un identificator. Astfel de elemente de pe pagina poate fi mare. În general, nu este selector specific.
- clasă. Pentru a crea o clasă și adăugați elementele pe care avem nevoie de un pic de lucru. Element pentru care clasa specificat are o mult mai specific decât elementul fără o clasă, dar aceste elemente pot fi, de asemenea, o mulțime.
- id - un grad ridicat de specificitate. prin reguli identificator indică doar un element particular, prin urmare, de specificul maxim selector ID. Cu toate acestea, și el a găsit un rival.
- Inlaynovy stil specific, astfel încât nu are nevoie de nici un selector. Este cel mai evident și direct mod indică elementul care urmează să fie aplicat. Am muncit din greu pentru a aduce acest stil de masă comună și se leagă direct la un element, aceasta înseamnă că, pentru motivul, atunci acest element ar trebui să arate în acest fel și nici un alt.
Să sperăm că, ideea generală este clar. De-a lungul timpului veți începe să înțeleagă ce subconstient selector mai puternic și modul de consolidare a statului, dacă este necesar.
selectoare de greutate
Pentru comoditatea calculelor fiecare selector atribuit o valoare numerică, sau greutatea.
Vă rugăm să rețineți:
- Selector universal cântărește 0.
- Combinatoare selectori contextuale (+
^ Space) - nu au nici o greutate. De asemenea, nu au greutatea regulilor moștenite de la părinți.
Zero greutate și absența completă a greutății - acestea sunt concepte diferite.
Există un element p și durata atașat. Pentru un paragraf seta culoarea albastră a textului, și ne-am putea aștepta ca această regulă să fie extins la durata imbricată. Cu toate acestea, avem o regulă care este legat la selectorul universal, care determină culoarea portocalie a textului pentru toate elementele. Un element p va fi înlocuită (deoarece selectorul de tag-ul universal puternic), dar pentru elementul etalon - nu (ca selectorul universal cu stiluri moștenite de greutate mai mare de zero, care au, în general, nici o greutate).
Lorem ipsum dolor.
Determinarea greutății selectorului
Greutate selectoare complicate este definit ca suma ponderilor simpla lor constitutiv:
- De exemplu, selectorul de context strămoș div interval are o greutate de 2, deoarece acesta include două selectoare pe tag-ul, dar diferența nu combinatorului greutăți.
-Compozit div.border selector are o greutate de 11.
Cât de mult cântărește un astfel de selector de complex?
ul # MainMenu> li.listItem: primul copil> a [href = * "wikipedia"]
stiluri Inlaynovye
Să ne asigurăm că stilul inlaynovy de cel mai greu și cel mai important.