Справочник по 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

Ссылки на источники

http://msdn.microsoft.com/en-us/library/ms531161(VS.85).aspx

https://developer.mozilla.org/en/CSS/table-layout

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="http://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования