Style alignContent property

definitie en gebruik

Wanneer de items niet alle beschikbare ruimte op de horizontale as (verticaal) gebruiken:AlignContent Eigenschap voor het uitlijnen van de items van de elastische container.

tip：Gebruik JustifyContent property Richten van items op de hoofdas (horizontaal).

opmerking：Er moeten meerdere regels items zijn om deze eigenschap effectief te maken.

voorbeeld

Plaats de items van de elastische <div> elementen tussen de twee regels met ruimte:

document.getElementById("main").style.alignContent = "space-between";

Probeer het zelf uit

syntaxis

Geef de alignContent eigenschap terug：

object.style.alignContent

Stel de alignContent eigenschap in：

object.style.alignContent = "stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit"

eigenschapswaarde

waarde beschrijving
stretch standaardwaarde. De regel trekt zich uit om de resterende ruimte in te nemen.
center Items liggen in het midden van de container.
flex-start Items liggen aan het begin van de container.
flex-end Items liggen aan het einde van de container.
space-between Items liggen op de regels tussen met ruimte.
space-around Er zijn witruimtes voor de regel, de regel tussen en de regel achter het item.
initial Stel deze eigenschap in op zijn standaardwaarde. Raadpleeg initial。
inherit Deze eigenschap erft deze eigenschap van zijn ouder-element. Raadpleeg inherit。

technische details

standaardwaarde： stretch
terugkeerwaarde： tekenreeks die de align-content eigenschap。
CSS versie： CSS3

browserondersteuning

AlignContent is een CSS3 (1999) kenmerk.

Alle browsers ondersteunen het volledig：

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
ondersteund ondersteund ondersteund ondersteund ondersteund 11

gerelateerde pagina's

CSS 参考手册：align-content eigenschap

HTML DOM STYLE 参考手册：alignItems eigenschap

HTML DOM STYLE 参考手册：alignSelf eigenschap

HTML DOM STYLE 参考手册：JustifyContent property