Kiểu căn chỉnh Thuộc tính nội dung
Ví dụ
Định vị các mục của phần tử <div> linh hoạt với khoảng cách giữa các dòng:
document.getElementById("main").style.alignContent = "space-between";
Hãy tự mình thử »Sự miêu tả
Thuộc tính AlignContent căn chỉnh các mục của vùng chứa linh hoạt khi các mục đó không sử dụng hết không gian có sẵn trên trục chéo (theo chiều dọc).
Mẹo: Sử dụng thuộc tínhjustContent để căn chỉnh các mục trên trục chính (theo chiều ngang).
Lưu ý: Phải có nhiều dòng mục để thuộc tính này có hiệu lực.
Cú pháp
Trả về thuộc tính AlignContent:
object .style.alignContent
Đặt thuộc tính AlignContent:
object .style.alignContent = "stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit"
Giá trị tài sản
Value | Description |
---|---|
stretch | Default value. Items are stretched to fit the container |
center | Items are positioned at the center of the container |
flex-start | Items are positioned at the beginning of the container |
flex-end | Items are positioned at the end of the container |
space-between | Items are positioned with space between the lines |
space-around | Items are positioned with space before, between, and after the lines |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Chi tiết kỹ thuật
Giá trị mặc định: | kéo dài |
---|---|
Giá trị trả về: | Một Chuỗi, biểu thị thuộc tính căn chỉnh nội dung của một phần tử |
Phiên bản CSS | CSS3 |
Hỗ trợ trình duyệt
alignContent
là một tính năng CSS3 (1999).
Nó được hỗ trợ đầy đủ trong tất cả các trình duyệt:
Chrome | Edge | Firefox | Safari | Opera | IE |
Yes | Yes | Yes | Yes | Yes | 11 |
Trang liên quan
Tham chiếu CSS: thuộc tính căn chỉnh nội dung
HTML DOM STYLE Tham chiếu: thuộc tính AlignItems
HTML DOM STYLE Tham chiếu: thuộc tính AlignSelf
Tham chiếu STYLE DOM DOM: thuộc tính justifyContent