Korkeus - CSS-temppuja | CSS-almanakka 2025

heightOminaisuus CSS määritellään täsmennetään sisältöä korkeus laatikoiden ja hyväksyy minkä tahansa pituuden arvoja.

"Sisältö" -alue määritetään täytteeksi ja reunaksi sen sisällön korkeuden / leveyden tai koon lisäksi.

Tällaisia negatiivisia arvoja height: -100pxei hyväksytä. heightOminaisuus ei sovelleta ei-korvattavien elementtien kuten taulukon sarakkeita ja sarakkeen ryhmiä.

.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 */ )

Katso tämä kynä!

Jos sisältävän lohkon korkeutta ei ole määritelty nimenomaisesti eikä elementti ole ehdottomasti sijoitettu, sen korkeuden arvo lasketaan automaattiseksi (se on yhtä pitkä kuin sen sisällä oleva sisältö tai nolla, jos sisältöä ei ole). Jos elementtien sisältöosa vaatii enemmän pystytilaa kuin käytettävissä olevasta arvosta käytettävissä, ominaisuus määrittää elementtien käyttäytymisen overflow.

Kun käyttämällä avainsanaa auto, heightlasketaan elementtien sisältöalue ellei erikseen mainittu. Tämä tarkoittaa, että prosentteihin perustuva arvo on edelleen elementtien sisältöalueen arvo. Vastaavasti, jos säiliön korkeudeksi asetetaan prosentuaalinen arvo, lapsielementtien prosenttiosuuden korkeus perustuu edelleen kyseisen lapsielementin sisältöalueeseen.

Korkeutta voidaan käyttää myös animoitavana ominaisuutena.