Thuộc tính align-items CSS

Định nghĩa và cách sử dụng

align-items Thuộc tính này xác định cách đặt vị trí mặc định cho các item trong container 弹性.

Lưu ý:Sử dụng thuộc tính của mỗi item align-self Thuộc tính để bù lại thuộc tính này.

Xem thêm:

Hướng dẫn CSS:CSS Grid

Hướng dẫn CSS:Flexbox CSS

Hướng dẫn CSS:Thuộc tính align-content

Hướng dẫn CSS:Thuộc tính align-self

Hướng dẫn CSS:Thuộc tính justify-content

Hướng dẫn CSS:Thuộc tính justify-items

Hướng dẫn CSS:Thuộc tính justify-self

Hướng dẫn HTML DOM:Thuộc tính alignItems

Mô hình

Đặt trung tâm các item của element <div>弹性:

div {
  display: flex;
  align-items: center;
}

Thử nghiệm trực tiếp

Cú pháp CSS

align-items: stretch|center|flex-start|flex-end|baseline|initial|inherit;

Giá trị thuộc tính

Giá trị Mô tả
stretch Mặc định. Item được kéo giãn để phù hợp với container.
center Item nằm ở giữa container.
flex-start Item nằm ở đầu container.
flex-end Item nằm ở cuối container.
baseline Item được định vị tại đường cơ bản của container.
initial Đặt thuộc tính này về giá trị mặc định. Xem thêm initial.
inherit Thực thị từ element cha. Xem thêm inherit.

Chi tiết kỹ thuật

Giá trị mặc định: stretch
Kế thừa: Không
Tạo animation: Không hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation.
Phiên bản: CSS3
Cú pháp JavaScript: object.style.alignItems="center"

Hỗ trợ trình duyệt

Số trong bảng cho biết phiên bản trình duyệt đầu tiên hỗ trợ hoàn toàn thuộc tính này.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
57.0 16.0 52.0 10.1 44.0