Beispiel
Machen Sie etwas Platz zwischen den Elementen des flexiblen <div> Element:
document.getElementById("main".style.justifyContent = "space-between"; Versuch es selber " Definition und Verwendung
Die justifyContent Eigenschaft richtet die flexiblen Elemente des Containers , wenn die Elemente auf der Hauptachse nicht den gesamten verfügbaren Speicherplatz verwenden (horizontally) .
Tipp: Verwenden Sie die alignContent Eigenschaft die Elemente auf der Querachse auszurichten (vertically) .
Browser-Unterstützung
Die Rechtfertigung-content-Eigenschaft wird in Firefox, Opera und Chrome unterstützt.
Syntax
Bringen Sie die justifyContent Eigenschaft:
object .style.justifyContent Stellen Sie die justifyContent Eigenschaft:
object .style.justifyContent="flex-start|flex-end|center|space-between|space-around|initial|inherit"
Eigenschaftswerte
| Wert | Beschreibung |
|---|---|
| flex-start | Standardwert. Einzelteile werden zu Beginn des Behälters positioniert |
| flex-end | Die Elemente werden am Ende des Behälters positioniert |
| center | Die Artikel werden in der Mitte des Behälters positioniert |
| space-between | Die Artikel werden mit Raum zwischen den Linien positioniert |
| space-around | Einzelteile werden vor mit Raum positionieren, zwischen und nach den Zeilen |
| initial | Setzt diese Eigenschaft auf den Standardwert. Lesen Sie mehr über Anfang |
| inherit | Erbt diese Eigenschaft von seinem übergeordneten Elemente. Lesen Sie mehr über erben |
Technische Details
| Standardwert: | flex-Start |
|---|---|
| Rückgabewert: | Ein String, als Vertreter der rechtfertigen-Inhaltseigenschaft eines Elements |
| CSS Version | CSS3 |
Verwandte Seiten
CSS - Referenz: justify-content property - justify-content property
HTML - DOM - ART - Referenz: alignContent property
HTML - DOM - ART - Referenz: alignItems property
HTML - DOM - ART - Referenz: alignSelf property
<Style - Objekt