Înălțime - CSS-Tricks

Anonim

heightProprietatea în CSS definește Specifică înălțimea conținutului de cutii și acceptă oricare dintre valorile de lungime.

Zona „conținut” este definită ca umplutura și chenarul, în plus față de înălțimea / lățimea sau dimensiunea pe care o ocupă conținutul în sine.

height: -100pxNu sunt acceptate valori negative precum . heightProprietatea nu se aplică la elementele care nu sunt înlocuite inline , inclusiv coloanele de masă și grupuri de coloane.

.wrap ( height: auto; /* auto keyword */ height: 120px; /* length values */ height: 10em; height: 0; /* unit-less length is OK for zero */ height: 75%; /* percentage value */ height: inherit; /* inherited value from parent element */ )
Verificați acest stilou!

Dacă înălțimea blocului care conține nu este specificată în mod explicit și elementul nu este poziționat absolut, valoarea înălțimii sale se calculează la auto (va fi la fel de înaltă ca și conținutul din interior sau zero dacă nu există conținut). Dacă porțiunea de conținut a elementelor necesită mai mult spațiu vertical decât disponibil din valoarea atribuită, comportamentul elementelor este definit de overflowproprietate.

Când utilizați cuvântul cheie auto, heighteste calculat pe baza zonei de conținut a elementelor , cu excepția cazului în care este specificat în mod explicit. Aceasta înseamnă că o valoare bazată pe un procent este încă cea a zonei de conținut a elementelor. În mod similar, dacă înălțimea containerului este setată la o valoare procentuală, înălțimea procentuală a elementelor copil se bazează în continuare pe zona de conținut a acelui element copil.

Înălțimea poate fi folosită și ca proprietate animabilă.

Suport pentru browser

IE Margine Firefox Crom Safari Operă
Toate Toate Toate Toate Toate Toate
Android Chrome Android Firefox Browser Android Safari iOS Opera Mobile
Toate Toate Toate Toate Toate
Sursa: caniuse

Proprietăți conexe

Almanah la 15 ianuarie 2021

înălțimea maximă

.element ( max-height: 3rem; ) Sara Cope