Style justifyContent -Eigenschaft
Style-ObjektBeispiel
Lassen Sie Abstand um die Elemente eines flexiblen <div>-Elements:
document.getElementById("main".style.justifyContent="space-between";
Selbst ausprobieren »
Definition und Verwendung
Die justifyContent-Eigenschaft richtet die Elemente in einem flexiblen Container aus, wenn die Elemente nicht den gesamten verfügbaren Platz auf der Hauptachse (horizontal) einnehmen.
Tipp:Verwenden Sie die alignContent-Eigenschaft, um die Elemente auf der Cross-Achse (vertikal) auszurichten.
Browser-Unterstützung
Firefox, Opera und Chrome unterstützen die justify-content-Eigenschaft.
Syntax
Zurückgeben der justifyContent-Eigenschaft:
object.style.justifyContent
Festlegen der justifyContent-Eigenschaft:
object.style.justifyContent="flex-start|flex-end|center|space-between|space-around|initial|inherit"
Eigenschaftswerte
| Wert | Beschreibung |
|---|---|
| flex-start | Standardwert. Die Elemente werden am Anfang des Containers positioniert. |
| flex-end | Die Elemente werden am Ende des Containers positioniert. |
| center | Die Elemente werden in der Mitte des Containers positioniert. |
| space-between | Die Elemente werden im Container mit Abstand zwischen den Linien positioniert. |
| space-around | Die Elemente werden im Container mit Abstand vor, zwischen und nach den Linien positioniert. |
| initial | Setzt diese Eigenschaft auf ihren Standardwert. Sieheinitial。 |
| inherit | Erbt diese Eigenschaft von seinem Elternelement. Sieheinherit。 |
Technische Details
| Standardwert: | flex-start |
|---|---|
| Rückgabewert: | Eine Zeichenfolge, die die justify-content-Eigenschaft des Elements darstellt. |
| CSS-Version | CSS3 |
Ähnliche Artikel
CSS-Referenzhandbuch:justify-content-Eigenschaft
HTML DOM Style Referenzhandbuch:alignContent-Eigenschaft
HTML DOM Style Referenzhandbuch:alignItems-Eigenschaft
HTML DOM Style Referenzhandbuch:alignSelf-Eigenschaft
Andere Erweiterungen