Thuộc tính table-layout trong CSS

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

Thuộc tính tableLayout được sử dụng để hiển thị các quy tắc thuật toán của bảng cho các ô bảng, hàng và cột.

Bố cục bảng cố định:

So với bố cục bảng tự động, bố cục bảng cố định cho phép trình duyệt nhanh chóng hơn trong việc bố cục bảng.

Trong bố cục bảng cố định, bố cục ngang chỉ phụ thuộc vào bề rộng bảng, bề rộng cột, bề rộng viền bảng, khoảng cách giữa các ô, và không liên quan đến nội dung của các ô.

Bằng cách sử dụng bố cục bảng cố định, người đại diện người dùng có thể hiển thị bảng sau khi nhận được dòng đầu tiên.

Bố cục bảng tự động:

Trong bố cục bảng tự động, bề rộng của cột được xác định bởi nội dung rộng nhất trong ô cột không có dòng gãy.

Algoritム này có thể chậm một chút vì nó cần truy cập vào tất cả nội dung trong bảng trước khi xác định bố cục cuối cùng.

Giải thích

Thuộc tính này xác định thuật toán bố cục được sử dụng để hoàn thành bố cục bảng. Thuật toán bố cục cố định nhanh hơn nhưng không linh hoạt bằng, trong khi thuật toán tự động chậm hơn nhưng phản ánh tốt hơn bảng HTML truyền thống.

Xem thêm:

Hướng dẫn CSS:Bảng CSS

Hướng dẫn tham khảo HTML DOM:Thuộc tính tableLayout

Ví dụ

Thiết lập thuật toán bố cục của bảng:

table
  {
  table-layout:fixed;
  }

Thử nghiệm ngay

Ngữ pháp CSS

table-layout: auto|fixed|initial|inherit;

Giá trị thuộc tính

Giá trị Mô tả
automatic Mặc định. Bề rộng của cột được xác định bởi nội dung của ô.
fixed Bề rộng của cột được xác định bởi bề rộng của bảng và bề rộng của cột.
inherit Định nghĩa rằng giá trị của thuộc tính table-layout nên kế thừa từ phần tử cha.

Chi tiết kỹ thuật

Giá trị mặc định: auto
Kế thừa: yes
Phiên bản: CSS2
Ngữ pháp JavaScript: object.style.tableLayout="fixed"

Thử nghiệm thêm

Thiết lập bố cục của bảng
Ví dụ này minh họa cách thiết lập bố cục của bảng.

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 đó.

Chrome IE / Edge Firefox Safari Opera
14.0 5.0 1.0 1.0 7.0