Создание таблиц. Вертикальное выравнивание

В предыдущих уроках мы научились создавать таблицы на конкретном

примере.

Вернемся к нашему примеру, и поговорим о вертикальном выравнивании

содержимого таблицы, т.е. о том, как можно сделать так, чтобы содержимое

ячейки не только располагалось ровно посередине ее (как по умолчанию), а

еще вверху или внизу. Вертикальное выравнивание задается следующим

атрибутом - valign="middle" (top, bottom) - содержимое конкретной ячейки

будет находится в середине ячейки (наверху или внизу):

Вот наглядный пример, как это выглядит. А теперь разберемся, как это

пишется:

<table>
<tr>
<td height="35" width="50" bgcolor="#FFCC33" valign="top"> 
<center>1x1</center> </td>
<td width="50" bgcolor="#336699"> <center>1x2</center>
 </td>
<td width="50" bgcolor="#FFCC33" valign="bottom"> 
<center>1x3</center> </td>
</tr>
<tr>
<td height="35" width="50" bgcolor="#336699" valign="bottom"> 
<center>2x1</center> </td>
<td width="50" bgcolor="#FFCC33"> <center>2x2</center>
 </td>
<td width="50" bgcolor="#336699" valign="top"> 
<center>2x3</center> </td>
</tr>
</table>

Мы прописали valign не для всех ячеек, только для тех, где мы захотели

чтобы текст располагался сверху или снизу. Существование атрибута valign

значительно облегчает работу над выравниванием содержимого таблиц.

Из этого урока мы узнали что - align служит для горизонтального

выравнивания, а valign для вертикального.

Вот значения для атрибута valign:

top - выравнивание по верхнему краю

center - выравнивание по центру

bottom - выравнивание по нижниму краю

Поделиться...