<self-position>
Kiểu dữ liệu giá trị enumerated <self-position> được sử dụng bởi các thuộc tính justify-self và align-self, và thuộc tính viết tắt place-self, để căn chỉnh hộp trong vùng chứa căn chỉnh của nó. Nó cũng được sử dụng bởi các thuộc tính justify-items và align-items, và thuộc tính viết tắt place-items, để chỉ định các giá trị mặc định cho justify-self và align-self.
Cú pháp
<self-position> = center | start | end | self-start | self-end | flex-start | flex-end
Giá trị
Các giá trị từ khóa sau được đại diện bởi thuật ngữ ngữ pháp <self-position>:
center-
Căn giữa đối tượng căn chỉnh trong vùng chứa căn chỉnh của nó.
start-
Căn chỉnh đối tượng căn chỉnh sát với cạnh bắt đầu của vùng chứa căn chỉnh.
end-
Căn chỉnh đối tượng căn chỉnh sát với cạnh kết thúc của vùng chứa căn chỉnh.
self-start-
Căn chỉnh đối tượng căn chỉnh sát với cạnh của vùng chứa căn chỉnh tương ứng với phía bắt đầu của đối tượng căn chỉnh.
self-end-
Căn chỉnh đối tượng căn chỉnh sát với cạnh của vùng chứa căn chỉnh tương ứng với phía kết thúc của đối tượng căn chỉnh.
flex-start-
Trong bố cục flex, căn chỉnh đối tượng căn chỉnh sát với cạnh của vùng chứa căn chỉnh tương ứng với phía bắt đầu chính hoặc bắt đầu chéo của vùng chứa flex, tùy theo trường hợp. Giống với
startđối với các chế độ bố cục khác bố cục flex. flex-end-
Trong bố cục flex, căn chỉnh đối tượng căn chỉnh sát với cạnh của vùng chứa căn chỉnh tương ứng với phía kết thúc chính hoặc kết thúc chéo của vùng chứa flex, tùy theo trường hợp. Giống với
endđối với các chế độ bố cục khác bố cục flex.
Note:
Các từ khóa left và right bị loại trừ khỏi <self-position>, mặc dù là các giá trị căn chỉnh vị trí hợp lệ cho các thuộc tính justify-* (justify-content, justify-self, và justify-items), vì chúng không được phép trong các thuộc tính align-* (align-content, align-self, và align-items). Thay vào đó, chúng được bao gồm rõ ràng trong ngữ pháp của các thuộc tính justify-*.
Thông số kỹ thuật
| Specification |
|---|
| CSS Box Alignment Module Level 3 # typedef-self-position |
Xem thêm
- Các thuộc tính sử dụng kiểu dữ liệu này:
align-self,justify-self,place-self,align-items,justify-items,place-items - Các kiểu dữ liệu căn chỉnh hộp khác:
<baseline-position>,<content-distribution>,<overflow-position>, và<content-position> - Mô-đun CSS box alignment
- Mô-đun CSS flexible box layout
- Mô-đun CSS grid layout