CSS Height și Width. Setarea lățimii maxime.
Partajeaza in Google Classroom
Partajeaza cu Google Classroom
Susține Lectii-Virtuale!
Memorator: Descriere video Descarcă PDF
Setarea lățimii maxime (max-width)
Proprietatea max-width este utilizată pentru a seta lățimea maximă a unui element.
Lățimea maximă (max-width) poate fi specificată în valori de lungime, cum ar fi px, cm, etc., sau în procente (%) din blocul conținut sau setat pe niciunul (acesta este implicit. Înseamnă că nu există o lățime maximă).
Problema cu <div> de mai sus apare atunci când fereastra browserului este mai mică decât lățimea elementului (500px). Browserul apoi adaugă o pagină de defilare orizontală la pagină.
Folosind în schimb această lățime maximă (max-width), în această situație, veți îmbunătăți gestionarea browserului de la ferestrele mici.
Sfat: Trageți fereastra browserului la o lățime mai mică de 500px, pentru a vedea diferența dintre cele două div-uri!
Notă: Valoarea proprietății max-width înlocuiește lățimea.
Exemplu:
Acest element <div> are o înălțime de 100 de pixeli și o lățime maximă de 500 de pixeli:
Proprietatea max-width este utilizată pentru a seta lățimea maximă a unui element.
Lățimea maximă (max-width) poate fi specificată în valori de lungime, cum ar fi px, cm, etc., sau în procente (%) din blocul conținut sau setat pe niciunul (acesta este implicit. Înseamnă că nu există o lățime maximă).
Problema cu <div> de mai sus apare atunci când fereastra browserului este mai mică decât lățimea elementului (500px). Browserul apoi adaugă o pagină de defilare orizontală la pagină.
Folosind în schimb această lățime maximă (max-width), în această situație, veți îmbunătăți gestionarea browserului de la ferestrele mici.
Sfat: Trageți fereastra browserului la o lățime mai mică de 500px, pentru a vedea diferența dintre cele două div-uri!
Notă: Valoarea proprietății max-width înlocuiește lățimea.
Exemplu:
Acest element <div> are o înălțime de 100 de pixeli și o lățime maximă de 500 de pixeli:
div {
max-width: 500px;
height: 100px;
background-color: powderblue;
}
Rezultat: Navigare în lectii
Cumpara abonament
Ajutor
Feedback-ul d-voastră este important pentru noi. Dacă observați vreo neregulă vă rugăm să ne-o semnalați apăsând butonul Trimite Feedback de mai jos.
