Таблиця – зручний засіб подання даних, яким притаманна чітко виражена внутрішня структура, - наприклад, фінансових звітів, списків товарів.
Мова HTML пропонує декілька спеціальних дескрипторів для створення таблиць Дескриптори <TABLE> і </TABLE> обмежують текст опису майбутньої таблиці, тег <TR> використовується для визначення її стрічок, а <TH> і <TD> дозволяють створювати комірки таблиці.
Існує два типи комірок, з яких може бути побудована таблиця. Дескриптор <TH> відповідає за створення комірок з заголовками, а тег <TD> дає можливість визначення комірок для зберігання даних таблиці. Комірки з заголовками зазвичай містять текстовий опис даних конкретної стрічки або стовпчика таблиці, а комірки даних зберігають у собі основну інформацію. Вміст комірок заголовків відображається напівжирним шрифтом і вирівнюється по центру.
Для того, щоб створити таблицю потібно:
ввести дані, які повинні відображатись у першій стрічці таблиці;
використовуйте символи табуляції для візуального виділення даних кожної комірки;
ввести дані, які потрібно помістити у другу стрічку таблиці;
повторити операцію для всіх решти стрічок таблиці;
ввести <TABLE> безпосередньо перед текстом, що визначає вміст таблиці;
набрати </TABLE> після завершення тексту таблиці;
ввести <TR> перед фрагментами тексту, що являють собою дані кожної стрічки таблиці;
набрати </TR> по закінченні фрагментів тексту кожної стрічки таблиці;
ввести <TH> перед текстом кожної комірки заголовка;
завершити текст кожної комірки заголовка тегом </TH>;
ввести <TD> перед текстом кожної комірки даних;
завершити текст кожної комірки даних тегом </TD>.
Наприклад,
<H1> <CENTER>Товари та ціни</CENTER></H1>
<TABLE>
<TR>
<TH>Назва товару</TH>
<TH>Ціна 1 шт. </TH>
<TH>Кількість на складі</TH>
</TR>
<TR>
<TD>Олівці</TD>
<TD>1 грн. </TD>
<TD>100</TD>
</TR>
<TR>
<TD>Ручки</TD>
<TD>5 грн. </TD>
<TD>200</TD>
</TR>
<TR>
<TD>Лінійки</TD>
<TD>2 грн. <T/D>
<TD>150</TD>
</TR>
</TABLE>
відобразиться браузером:
Товари та ціни
Назва товару | Ціна 1 шт. | Кількість на складі |
Олівці | 1 грн. | |
Ручки | 5 грн. | |
Лінійки | 2 грн. |