Таблицы в HTML-документах используются не только для табличного представления данных, но и для компоновки различных объектов - текста, графики, ссылок и др. Начнем знакомство с таблицами с формирования простейшей таблицы - из одной клетки (одна строка и одна ячейка в строке). Для этого выполним следующие операции.
1. С помощью Блокнота создадим в рабочем каталоге файл table1.htm, записав в этот файл следующий текст:
<HTML>
<HEAD>
<TITLE> Простейшая таблица-1</TITLE>
</HEAD>
<BODY>
<TABLE>
<TR>
<TD>Этот текст-в ячейке таблицы</TD>
</TR>
</TABLE>
</BODY>
</HTML>
Просмотрим получившийся документ с помощью MS Internet Explorer. Видно, что в окне программы просмотра какие-либо следы таблицы отсутствуют. Дело в том, что теги<TABLE>, <TR> и <TD> просто объявили о наличии соответственно таблицы, строки таблицы и клетки таблицы, но никак не определили их оформление. Для определения вида оформления объектов в тегах HTML используются так называемые атрибуты. Сделаем в тексте предыдущего документа некоторые изменения и сохраним в рабочем каталоге файл как table2.htm. Модифицированный текст документа:
|
|
Атрибут BORDER в теге <TABLE > объявляет о наличии рамки и задает ширину "рельефа" вокруг рамки таблицы. Атрибут WIDTH в данном случае определяет ширину таблицы в 50% от ширины окна программы просмотра.
Задание 1.2.1. Изменяя ширину окна программы просмотра пронаблюдайте за изменением ширины исследуемой таблицы.
Задание 1.2.2. Уберите из атрибута BORDER значение ширины "рельефа" (текст "=3"), сохранив документ под именем table2a.htm и посмотрите на результат изменений.
Задание 1.2.3. Уберите из тега <TABLE> атрибут WIDTH, сохраните это изменение в файле table2b.htm и посмотрите на результат (выбрав кнопку "Обновить" в панели инструментов программы просмотра). Убедитесь в том, что в этом случае размер ячейки автоматически подгоняется под длину строки.
Задание 1.2.4. По документу table3.htm рассмотрите адресацию ячеек в таблице