.alert { color: #166534 !important; }\n.alert { color: #b91c1c; }Prima declarație rămâne câștigătoare, deși regula roșie apare mai târziu.
LECȚIA 20 DIN 100
Folosește !important controlat
Fă o singură declarație importantă și observă efectul ei în cascadă.
PASUL 1 · ÎNVAȚĂ
Cum funcționează
În aceeași origine, o declarație marcată !important are prioritate față de declarațiile normale. Ea trebuie folosită rar, deoarece schimbă ordinea obișnuită a cascadei.
.alert { color: #166534; }\n.alert { color: #b91c1c; }Fără !important, regulile au aceeași specificitate și culoarea roșie de la final câștigă.
PASUL 2 · APLICĂ
Exercițiul tău
Adaugă !important numai declarației verzi din prima regulă .alert.
index.htmlCSS
Rezultat sigurizolat
Ciorna se păstrează doar în acest browser.HTML și CSS permise · scripturile și rețeaua sunt blocate
PASUL 4 · VERIFICĂ
Ce trebuie să treacă
0%neverificat
- ○Prima culoare este marcată !important.
- ○Regula normală roșie rămâne după ea.
- ○Declarația importantă apare înaintea regulii normale.
Explică-mi logica rezolvării
Criteriul verifică atât valoarea, cât și prioritatea important. În proiecte reale, preferă mai întâi selectori și straturi bine organizate.