Thuộc tính column-count trong CSS
- trang trước màu sắc-chương trình
- Trang tiếp theo column-fill
Định nghĩa và cách sử dụng
Thuộc tính column-count quy định số lượng cột mà phần tử nên được phân chia.
Xem thêm:
Hướng dẫn CSS3:CSS3 Nhiều cột
Hướng dẫn tham khảo HTML DOM:Thuộc tính columnCount
Ví dụ
Chia văn bản trong thẻ div thành ba cột:
div { column-count:3; }
Có nhiều ví dụ khác ở cuối trang.
Cú pháp CSS
column-count: số|tự động;
Giá trị thuộc tính
Giá trị | Mô tả | Kiểm tra |
---|---|---|
số | Số lượng cột tốt nhất để phân chia nội dung của phần tử. | Kiểm tra |
tự động | Số lượng cột được xác định bởi các thuộc tính khác, ví dụ như "column-width". | Kiểm tra |
Chi tiết kỹ thuật
Giá trị mặc định: | tự động |
---|---|
Di truyền: | không |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | object.style.columnCount=3 |
Các ví dụ khác
- Column-gap
- Chia văn bản trong thẻ div thành ba cột và quy định khoảng cách giữa các cột là 30 pixel.
- Column-rule
- Định nghĩa chiều rộng, kiểu dáng và màu sắc giữa các cột.
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ợ đầy đủ thuộc tính này.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
50.0 4.0 -webkit- |
10.0 | 52.0 2.0 -moz- |
9.0 3.1 -webkit- |
37.0 15.0 -webkit 11.1 |
- trang trước màu sắc-chương trình
- Trang tiếp theo column-fill