Cât de bine stăpânești specificațiile moderne CSS3? Răspunde la cele 10 întrebări practice de mai jos pentru a primi o evaluare a nivelului tău tehnic și explicații detaliate pas cu pas pentru fiecare răspuns.
Întrebarea 1 din 10Nivel Tehnic CSS3
Ce efect are aplicarea regulii `box-sizing: border-box;` pe un element?
Corect! În mod implicit (content-box), adăugarea de padding sau bordură mărește fizic elementul peste lățimea definită. `border-box` păstrează lățimea declarată neschimbată, absorbind padding-ul și grosimea bordurii în interior.
Întrebarea 2 din 10Nivel Tehnic CSS3
Ce selector CSS3 are specificitate ZERO, permițând suprascrierea facilă a stilurilor?
Corect! În timp ce `:is()` preia specificitatea celui mai specific selector din lista sa de argumente, pseudo-clasa `:where()` are ÎNTOTDEAUNA specificitate 0 (zero), făcând-o ideală pentru stiluri de bază (reset / design system tokens).
Întrebarea 3 din 10Nivel Tehnic CSS3
Ce proprietate controlează alinierea elementelor pe axa secundară (cross-axis) într-un container Flexbox?
Corect! `justify-content` aliniază elementele pe axa principală (main axis), în timp ce `align-items` controlează alinierea pe axa perpendiculară (cross axis).
Întrebarea 4 din 10Nivel Tehnic CSS3
Cum creezi o grilă CSS Grid care generează automat câte coloane încap cu o lățime minimă de 250px?
Corect! Tehnica standard `repeat(auto-fit, minmax(250px, 1fr))` creează automat numărul optim de coloane fără a fi nevoie de niciun media query manual!
Întrebarea 5 din 10Nivel Tehnic CSS3
Ce pseudo-clasă CSS3 este supranumită „Selectorul de Părinte” (Parent Selector)?
Corect! Pseudo-clasa `:has()` permite stilizarea unui element părinte în funcție de copiii săi sau de starea acestora (de ex.: `form:has(input:invalid)`).
Întrebarea 6 din 10Nivel Tehnic CSS3
Care este avantajul folosirii funcției `clamp(1rem, 2.5vw, 2rem)` pentru dimensiunea fontului?
Corect! `clamp(min, preferat, max)` asigură fluiditate perfectă pe telefoane, tablete și monitoare 4K fără salturi bruște cauzate de breakpoint-uri multiple.
Întrebarea 7 din 10Nivel Tehnic CSS3
Care dintre următoarele proprietăți este accelerată pe GPU și NU produce reflow sau repaint în browser?
Corect! Modificarea `transform` și `opacity` se procesează în etapa de compoziție grafică direct pe placa video (GPU), garantând animații fluide la 60–120 FPS.
Întrebarea 8 din 10Nivel Tehnic CSS3
Ce diferență există între unitățile `rem` și `em` în CSS?
Corect! `rem` vine de la 'Root EM' și se raportează întotdeauna la font-size-ul setat pe eticheta `<html>`, prevenind efectul de multiplicare exponențială (compound scaling) întâlnit la `em`.
Întrebarea 9 din 10Nivel Tehnic CSS3
Ce rol are pseudo-clasa `:focus-visible` comparativ cu clasicul `:focus`?
Corect! `:focus-visible` este o inovație majoră de accesibilitate: păstrează conturul vizibil pentru cei care navighează cu tasta Tab, fără a frustra utilizatorii de mouse cu contururi nedorite la click.
Întrebarea 10 din 10Nivel Tehnic CSS3
Cum se definește corect o variabilă CSS (Custom Property) și cum se apelează în cod?
Corect! Variabilele native CSS se declară întotdeauna prefixate cu două liniuțe (`--nume`) și se consumă folosind funcția `var(--nume)`.
Rezultatul Testului Tău Tehnic:
0 / 10
Ghid de Studiu
Conceptele Fundamentale Verificate în acest Quiz
Fiecare întrebare din cadrul testului reflectă o provocare zilnică din dezvoltarea de interfețe web moderne. Dacă dorești să aprofundezi noțiunile teoretice și practice, explorează modulele noastre dedicate:
1. Specificitate & :where()
Înțelegerea modului în care cascada calculează specificitatea te ajută să elimini !important din cod.
Dezvoltator web cu peste 12 ani de experiență practică în arhitecturi front-end, sisteme de design scalabile și optimizarea performanței de randare (Core Web Vitals). Fiecare articol și generator de pe css3.ro este testat riguros cross-browser (Chromium, Gecko, WebKit) pentru a asigura precizie tehnică absolută și conformitate cu standardele deschise.
Acest site folosește module cookie tehnice, de analiză a traficului (Google Analytics) și de publicitate (Google AdSense) pentru a oferi o experiență optimă și conținut relevant conform politicilor Google și legislației GDPR. Puteți alege să acceptați sau să refuzați modulele cookie non-esențiale.