|
|
Введение в HTML.
Таблицы
Таблицы являются очень удобным средством форматирования данных на Web-странице. Основное удобство заключается в том, что таблицы позволяют решать дизайнерские задачи: выравнивать части страницы друг относительно друга, размещать рядом рисунки и текст, управлять цветовым оформлением и т.д. При создании таблиц используется
принцип вложения: внутри основного элемента таблицы (TABLE) создаётся ряд элементов, определяющих строки (TR), а внутри этих элементов
размещаются элементы для описания каждой ячейки в строке (TD).
<TABLE> </table>
Внешний элемент таблицы. Он позволяет задавать общие свойства таблицы и отделяет её структуру от остальной части Web-страницы. рассмотрим атрибуты этого элемента. Таблицу можно
выровнять по горизонтали при помощи атрибута
align:
align="left" - выравнивание по левому краю;
align="center" - выравнивание по центру;
align="right" - выравнивание по правому краю;
Ширину таблицы можно задать точно в
пикселях, или в процентом отношении к ширине страницы в окне
браузера. Например:
width=400
width=50%
Если таблица вложена в другую таблицу, то процентное отношение считается не от ширины страницы, а от этой таблицы.
<TR>
Элемент, создающий строку таблицы. Он не имеет конечного тега. Строка заканчивается там, где начинается следующая, то есть где стоит следующий элемент TR. Для выравнивания содержимого всех ячеек в строке можно использовать хорошо известный атрибут и
align и присваивать ему значения left,
center, right.
Кроме того, содержимое ячеек можно
выравнивать по вертикали:
valign="top"
valign="middle"
valign="bottom"
<TD>
Этот элемент определяет обычную ячейку таблицы. Если в ячейку помещено большое
количество текста, браузер разбивает его на строки так, чтобы сохранить требуемую конфигурацию таблицы. Конфигурацию может определять заданная
фиксированная ширина таблицы. необходимость согласовать размер таблицы и область просмотра, заданная ширина ячейки. При помощи атрибута
nowrap (он не имеет параметров) можно запретить форматирование текста. В этом случае в ячейке будет
создана одна строка, а таблица может уйти за край окна.
Атрибуты rowspan и сolspan позволяют объединять ячейки. Например при создании атрибута
rowspan=n
и условии, что n>1, соответствующая ячейка займёт не одну, а n строк и, соответственно, будет иметь размер в n раз больший, чем обычная ячейка данного столбца.
Хорошо известны атрибут align может использоваться и для одной ячейки.
Теперь, зная какие элементы используются для построения таблицы, мы сможем создать простейшую таблицу:
|
<table border="1" cellpadding="5" width="50%">
<tr>
<td width="50%" align="center" bgcolor="#FFFF00">Ячейка 1</td>
<td width="50%" align="center">Ячейка 2</td>
</tr>
<tr>
<td width="50%">Ячейка 3</td>
<td width="50%">Ячейка 4</td>
</tr>
</table> |
Вот как работает этот код:
|
Ячейка 1 |
Ячейка 2 |
| Ячейка 3 |
Ячейка 4 |
На этом я закончу свой краткий обзор основ HTML. Как видите всё очень просто и доступно даже школьнику.
<<< НАЗАД
____________________________________________________________________________
Тем кто зашел ради любопытства - приятного отдыха.
Тем кто зашел ради интереса - Вы обязательно найдете тут полезную информацию!
____________________________________________________________________________
|

|