Книга: HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов

Параметры размеров

Параметры размеров

Для задания размеров — ширины и высоты — таблиц и их ячеек подойдут атрибуты стиля width и height, описанные в главе 10.

— Если требуется задать ширину или высоту всей таблицы, нужный атрибут стиля указывают именно для нее:

TABLE { width: 100 %; height: 300px }

— Если требуется задать ширину столбца, атрибут стиля width указывают для первой ячейки, входящей в этот столбец (листинг 12.2).

Листинг 12.2

<TABLE>

<TR>

<TH>Первый столбец</TH>

<TH>Второй столбец шириной в 40 пикселов</TH>

<TH>Третий столбец</TH>

</TR>

.

</TABLE>

— Если требуется задать высоту строки, атрибут стиля height указывают для первой ячейки этой строки (листинг 12.3).

Листинг 12.3

<TABLE>

.

<TR>

<TD>Строка высотой в 30 пикселов</TD>

.

</TR>

.

</TABLE>

Обычно все размеры, которые мы зададим для таблицы и ее ячеек, — не более чем рекомендация для Web-обозревателя. Если содержимое таблицы не будет в ней помещаться, Web-обозреватель увеличит ширину или высоту таблицы. Зачастую это может быть неприемлемо, поэтому стандарт CSS предусматривает средства, позволяющие изменить такое поведение Web-обозревателя.

Атрибут стиля table-layout позволяет указать, как Web-обозреватель будет трактовать размеры, заданные нами для таблицы и ее ячеек:

table-layout: auto|fixed|inherit

— auto — Web-обозреватель может изменить размеры таблицы и ее ячеек, если содержимое в них не помещается. Это обычное поведение.

— fixed — размеры таблицы и ее ячеек ни в коем случае изменяться не будут. Если содержимое в них не помещается, возникнет переполнение, параметры которого мы можем задавать с помощью атрибутов стиля overflow, overflow-x и overflow-y (см. главу 10).

Данный атрибут стиля применяется к самой таблице (тегу <TABLE>).

Пример:

TABLE { table-layout: fixed; overflow: auto }

Оглавление книги


Генерация: 0.048. Запросов К БД/Cache: 0 / 0
поделиться
Вверх Вниз