Задание размеров ячеек с помощью относительных и абсолютных величин
Помимо (или вместо) указания размеров таблицы путем задания атрибутов height и width таблицы в дескрипторе <table>, вы можете создать таблицу определенной высоты и ширины за счет указания размеров ячеек таблицы.
ПРАКТИКУМ
Например, если вы хотите создать таблицу 800x600 с двумя строками по четыре столбца в каждой, вы можете задать каждую ячейку как 200x300 пикселей, записав дескриптор <td> для каждой ячейки следующим образом:
<td width="200" height="300">
(Чтобы задать размеры ячейки с данными-заголовками, установите атрибуты width и height в дескрипторе <th> ячейки заголовка.)
ПРИМЕЧАНИЕ: При определении ширины таблицы путем задания атрибута width в дескрипторе <table> таблицы следите за тем, чтобы ширина ячеек в каждой строке в сумме была строго равна ширине таблицы во избежание "странного" поведения, "проявления" которого специфичны для каждого отдельного браузера. Каждый из браузеров по-своему обращается с неправильно сформированными таблицами. Следовательно, если вы хотите контролировать внешний вид своей таблицы в любом из браузеров, не пишите HTML-код таблиц, в котором размеры таблицы находятся в противоречии с размерами ее ячеек.
Вместо задания размеров ячейки в виде фиксированного числа пикселей, вы можете дать Web-браузеру указание рисовать каждую ячейку как процент от общей ширины и высоты таблицы. Предположим, например, вы хотите, чтобы Web-браузер нарисовал таблицу, заполняющую окно браузера и имеющую три столбца равной ширины. HTML-код этой таблицы запишется следующим образом, как с относительной шириной (заданной значением атрибута width в дескрипторе <table>), так и со столбцами относительной ширины (заданной значением атрибутов width в дескрипторах <th> и <td>):
<table width="100%"><th width="33%">3аголовок 1</th><th width="33%">3аголовок 2</th><th width="33%">Заголовок 3</th><td width="33%">Данные столбца 1</td><td width="33%">Данные столбца 2</td><td width="33%">Данные столбца 3</td></table>
Или, если вы хотите задать таблицу с фиксированной шириной и двумя столбцами, занимающими 80 процентов ширины таблицы и одним столбцом, занимающим 20 процентов ее ширины, HTML-код таблицы должен выглядеть следующим образом:
<table width="600"><th width="40%">3аголовок 1</th><th width="40%">3аголовок 2</th><th width="20%">Заголовок 3</th><td width="40%">Данные столбца 1</td><td width="40%">Данные столбца 2</td><td width="20%">Данные столбца 3</td></table>
При задании размеров ячейки (или таблицы) вы можете задать ширину без задания высоты или наоборот. Однако если вы задаете размеры ячейки как процентные отношения к ширине таблицы, следите за тем, чтобы ширина таблицы была задана как число пикселей или как процент от окна Web-браузера путем задания атрибута width в дескрипторе <table> таблицы. Аналогично, если вы задаете высоту ячеек в таблице как процентное отношение к общей высоте таблицы, обязательно задайте также высоту таблицы. Чтобы задать высоту таблицы, установите атрибут height в дескрипторе <table> таблицы равным либо числу пикселей, либо процентному отношению к высоте окна браузера.