.action { background-color: #0f766e; } .action:hover { background-color: #115e59; }Culoarea devine mai închisă numai când butonul este indicat.
LECȚIA 81 DIN 100
Arată starea hover a unui buton
Oferă feedback vizual când un dispozitiv cu pointer indică butonul.
PASUL 1 · ÎNVAȚĂ
Cum funcționează
Pseudo-clasa :hover selectează un element indicat de cursor sau unul care conține elementul indicat. Este un feedback suplimentar pentru pointer, nu singurul mod de a comunica o acțiune.
.action { background-color: #115e59; }Schimbarea în regula de bază nu descrie o stare interactivă și se aplică permanent.
PASUL 2 · APLICĂ
Exercițiul tău
Păstrează fundalul de bază și setează #115e59 numai pentru .action:hover.
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
- ○Butonul are fundalul de bază #0f766e.
- ○Starea hover folosește #115e59.
- ○Elementul țintă este prezent în pagină.
Explică-mi logica rezolvării
Selectorul de bază stabilește aspectul normal, iar pseudo-clasa adaugă diferența numai în starea indicată.