Thuộc tính CSS grid-column-end

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

grid-column-end thuộc tính định nghĩa mục sẽ quét qua bao nhiêu cột, hoặc sẽ kết thúc ở đường dẫn cột (column-line) nào.

Xem thêm ở cuối trang.

Xem thêm:

Giáo trình CSS:CSS Lưới

Thực例

Ví dụ 1

Để "item1" quét qua ba cột:

.item1 {
  grid-column-end: span 3;
}

Thử ngay

Ví dụ 2

Bạn có thể sử dụng giá trị đường dẫn cột để thay thế số lượng cột cần quét qua:

.item1 {
  grid-column-end: 3;
}

Thử ngay

Ngữ pháp CSS

grid-column-end: auto|span n|column-line;

Giá trị thuộc tính

Giá trị Mô tả
auto Giá trị mặc định. Mục sẽ quét qua một cột.
span n Định nghĩa số lượng cột mà mục sẽ quét qua.
column-line Định nghĩa vị trí dừng hiển thị mục ở cột nào.

Chi tiết kỹ thuật

Giá trị mặc định: auto
Di truyền: Không
Chế tạo animation: Hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation.
Phiên bản: CSS Grid Layout Module Level 1
Ngữ pháp JavaScript: object.style.gridColumnEnd="5"

Hỗ trợ trình duyệt

Số liệu trong bảng ghi chú lại phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính đó.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44