Thuộc tính align-self CSS

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

align-self Thuộc tính này xác định cách đối齐 phần tử được chọn trong container elastic.

Lưu ý:Thuộc tính alignSelf sẽ thay thế thuộc tính của container elastic. align-items Thuộc tính.

Xem thêm:

Hướng dẫn CSS:CSS Grid

Hướng dẫn CSS:Flexbox trong CSS

Hướng dẫn CSS:Thuộc tính alignContent

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

Hướng dẫn CSS:Thuộc tính justifySelf

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

Mô hình

Để đối齐 trung tâm một trong các phần tử của yếu tố elastic trong:

#myBlueDiv {
  align-self: center;
}

Thử ngay

Ngữ pháp CSS

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

Giá trị thuộc tính

Giá trị Mô tả
auto Mặc định. Phần tử kế thừa thuộc tính align-items của container cha của nó, nếu không có container cha, thì là "stretch".
stretch Phần tử được kéo dãn để phù hợp với container.
center Phần tử nằm ở giữa của container.
flex-start Phần tử nằm ở đầu của container.
flex-end Phần tử nằm ở cuối của container.
baseline Phần tử được định vị ở đường cơ bản của容器.
initial Đặt thuộc tính này về giá trị mặc định. Xem thêm initial.
inherit Từ thuộc tính này được kế thừa từ phần tử cha. Xem thêm inherit.

Chi tiết kỹ thuật

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

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ 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