Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Расположение и границы : table-layout
смотрим также
Материал из Справочник Web-языков
Содержание |
Атрибут table-layout | Свойство tableLayout
Это свойство позволяет задать каким образом будет отображаться содержимое таблиц на странице.
Синтаксис
| HTML | { table-layout : sLayout } |
| Скрипты | [ sLayout = ] object.style.tableLayout |
Возможные значения
- sLayout
- Строка, которая может определять и принимать одно из следующих значений:
- Это свойство применяется только для тэга table.
- auto
- Значение по умолчанию. Ширина столбца задается равной ширине его ячейки с наиболее широким непереносимым контентом.
- fixed
- Ширина столбцов определяется либо с помощью тэга <col>, для таблицы ширина высчитывается суммированием значений тэга <col> всех столбцов; либо, если тэг <col> не задан, то ширина таблицы устанавливается равной ширине первой строки. Если для таблицы не задан параметр width, то при ее отображении по умолчанию принимается, что width="100%".
Замечания
Вы можете оптимизировать процесс вывода таблицы с помощью свойства tableLayout, что будет особенно полезно при отображении длинных таблиц. Соответственно, будет сокращаться время на их загрузку.
С помощью свойства tableLayout ширина таблиц высчитывается исходя из следующего порядка приоритетности:
1 Используя информацию, указанную в свойстве width для элементов col или colGroup. 2 Используя информацию, указанную в свойстве width для элемента td для первой строки таблицы. 3 Столбцы таблицы отображаются равными, невзирая на размер их содержимого.
Если размер содержимого ячейки превосходит ее установленный размер, то контент либо принудительно переносится на следующую строку, либо, если перенос невозможен, просто обрезается.
Если для свойства tableLayout установлено значение fixed, то можно воспользоваться свойством overflow для обработки ситуаций, когда размер контента превосходит ширину, установленную в элементе td. Если для ячейки установлена фиксированная высота, то контент, переносимый на следующую строчку из-за ограничения ширины, будет обрезан при достижении установленного значения высоты.
Установление для свойства tableLayout значения fixed значительно увеличивает скорость загрузки таблиц. Дополнительно заданная высота для ячейки также позволяет в еще большей степени увеличить скорость вывода контента на страницу, т.к. браузеру не надо анализировать содержимое таблицы; он просто выводит ячейки, для которых заранее заданы ширина и высота.
Примеры
В данном примере используется атрибут table-layout со значением fixed, чтобы задать формат вывода таблицы.
<TABLE STYLE="table-layout:fixed" WIDTH=600> <COL WIDTH=100><COL WIDTH=300><COL WIDTH=200> <TR HEIGHT=20> <TD>...</TD><TD>...</TD><TD>...</TD> </TR> : </TABLE>
Стандарты
Это свойство определено в Cascading Style Sheets (CSS), Level 2 (CSS2)
Поддерживаемые браузеры
Internet Explorer 5.5, 6.0, 7.0, 8.0
Opera 7.0, 8.0, 9.2, 9.5
Safari 1.3, 2.0, 3.1
Firefox 1.5, 2.0, 3.0
Смотри также
Enhancing Table Presentation, table
Ссылки на источники
https://msdn.microsoft.com/en-us/library/ms531161(VS.85).aspx
