Свойство CSS table-layout
Пример
Задайте различные алгоритмы верстки таблицы:
table.a {
table-layout: auto;
width: 180px;
}
table.b {
table-layout:
fixed;
width: 180px;
}
Определение и использование
Свойство table-layout
определяет алгоритм, используемый для разметки ячеек таблицы, строк и столбцов.
Подсказка: Основное преимущество табличной раскладки: исправлено; заключается в том, что таблица отображается намного быстрее. В больших таблицах пользователи не увидят ни одной части таблицы, пока браузер не отобразит всю таблицу. Таким образом, если вы используете table-layout: fixed, пользователи будут видеть верхнюю часть таблицы, пока браузер загружает и отображает остальную часть таблицы. Это создает впечатление, что страница загружается намного быстрее!
Значение по умолчанию: | авто |
---|---|
Унаследовано: | нет |
Анимация: | нет. Читать об анимации |
Версия: | CSS2 |
Синтаксис JavaScript: | объект .style.tableLayout="фиксированный" |
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.
Property | |||||
---|---|---|---|---|---|
table-layout | 14.0 | 5.0 | 1.0 | 1.0 | 7.0 |
Синтаксис CSS
table-layout: auto|fixed|initial|inherit;
Значения свойств
Value | Description | Play it |
---|---|---|
auto | Browsers use an automatic table layout algorithm. The column width is set by the widest unbreakable content in the cells. The content will dictate the layout | |
fixed | Sets a fixed table layout algorithm. The table and column widths are set by the widths of table and col or by the width of the first row of cells. Cells in other rows do not affect column widths. If no widths are present on the first row, the column widths are divided equally across the table, regardless of content inside the cells | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Связанные страницы
Учебное пособие по CSS: Таблица CSS
Справочник по HTML DOM: свойство tableLayout