Informatică Alte teme
Ce este responsiv design web?
Responsiv design web este o tehnică care face ca site-urile să se adapteze automat la dimensiunea ecranului dispozitivului, de la desktop la smartphone. Se realizează prin CSS, folosind media queries și unități flexibile.
Principii de bază
- Layout flexibil Utilizează unități relative (ex: procente) în loc de pixeli fixi pentru lățimi.
- Media queries Reguli CSS care se aplică doar la anumite dimensiuni de ecran, ex: @media (max-width: 600px).
- Imagini scalabile Setează max-width: 100% pe imagini pentru a le preveni depășirea containerului.
Exemplu de implementare
- 1 CSS pentru desktop .container{width:80%; margin:auto;}
- 2 Media query pentru mobil @media (max-width:768px){.container{width:95%;}}
- 3 Testare Redimensionează fereastra browserului pentru a verifica adaptarea.
Folosește tool-uri ca Chrome DevTools pentru a simula diferite dimensiuni de ecran în timpul dezvoltării.