<self-position>
Der <self-position> aufgezählte Wertedatentyp wird von den Eigenschaften justify-self und align-self sowie der Kurzform place-self verwendet, um das Feld innerhalb seines Ausrichtungscontainers auszurichten. Er wird auch von den Eigenschaften justify-items und align-items sowie der Kurzform place-items verwendet, um Standardwerte für justify-self und align-self festzulegen.
Syntax
<self-position> = center | start | end | self-start | self-end | flex-start | flex-end
Werte
Die folgenden Schlüsselwortwerte werden durch den <self-position>-Grammatikbegriff dargestellt:
center-
Zentriert das Ausrichtungsobjekt innerhalb seines Ausrichtungscontainers.
start-
Richten Sie das Ausrichtungsobjekt bündig mit der Startkante des Ausrichtungscontainers aus.
end-
Richten Sie das Ausrichtungsobjekt bündig mit der Endkante des Ausrichtungscontainers aus.
self-start-
Richten Sie das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers aus, die der Startseite des Ausrichtungsobjekts entspricht.
self-end-
Richten Sie das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers aus, die der Endseite des Ausrichtungsobjekts entspricht.
flex-start-
Im Flex-Layout wird das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers ausgerichtet, die der main-start- oder cross-start-Seite des Flex-Containers entspricht, je nach Bedarf. Es ist identisch mit
startfür andere Layoutmodi als das Flex-Layout. flex-end-
Im Flex-Layout wird das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers ausgerichtet, die der main-end- oder cross-end-Seite des Flex-Containers entspricht, je nach Bedarf. Identisch mit
endfür andere Layoutmodi als das Flex-Layout.
Hinweis:
Die Schlüsselwörter left und right sind von <self-position> ausgeschlossen, obwohl sie gültige Positionsausrichtungswerte für die justify-* Eigenschaften (justify-content, justify-self, und justify-items) sind, weil sie in den align-* Eigenschaften (align-content, align-self, und align-items) nicht erlaubt sind. Sie werden stattdessen explizit in den Grammatiken der justify-* Eigenschaften einbezogen.
Spezifikationen
| Specification |
|---|
| CSS Box Alignment Module Level 3 # typedef-self-position |
Siehe auch
- Eigenschaften, die diesen Datentyp verwenden:
align-self,justify-self,place-self,align-items,justify-items,place-items - Andere Datenarten zur Box-Ausrichtung:
<baseline-position>,<content-distribution>,<overflow-position>, und<content-position> - CSS-Box-Ausrichtung Modul
- CSS-Flexibles Box-Layout Modul
- CSS-Raster-Layout Modul