Модуль: Создание таблицы в html-документе

Таблицы в HTML используются для:

• Организации данных в строках и столбцах.
• Отображения расписаний, статистики, сравнения данных.
• Создания структурированных макетов (хотя сейчас для этого чаще используется CSS).

При создании таблицы на HTML странице используются следующие теги:

1. <table> — контейнер для таблицы.

2. <thead> — блок для заголовков таблицы.

3. <tbody> — блок для основного содержимого таблицы.

4. <tr> — строка таблицы.

5. <th> — ячейка-заголовок (обычно внутри <thead>).

6. <td> — ячейка таблицы (обычная, внутри <tbody>).

7. Атрибуты:

   • border — границы таблицы.

   • width — ширина таблицы.

   • cellpadding — отступы внутри ячеек.

   • cellspacing — расстояние между ячейками.

   • colspan — объединение ячеек по горизонтали.

   • rowspan — объединение ячеек по вертикали.

Алгоритм создания таблицы на странице

1. Откройте HTML-документ.

2. Добавьте тег <table>.

3. Внутри <table> создайте блок <thead> для заголовков:

   • Добавьте строку <tr>.

   • Внутри строки добавьте ячейки-заголовки <th>.

4. Внутри <table> создайте блок <tbody> для основного содержимого:

   • Добавьте строки <tr>.

   • Внутри каждой строки добавьте ячейки <td>.

5. Настройте таблицу с помощью атрибутов (border, width, cellpadding, cellspacing).

6. При необходимости объедините ячейки с помощью colspan и rowspan.
    

Пример создания таблицы

<table border="1" width="500" cellpadding="10" cellspacing="0">
    <thead>
        <tr>
            <th>Заголовок 1</th>
            <th>Заголовок 2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Данные 1</td>
            <td>Данные 2</td>
        </tr>
        <tr>
            <td>Данные 3</td>
            <td>Данные 4</td>
        </tr>
    </tbody>
</table>