Таблицы в HTML используются для структурированного отображения данных. Рассмотрим основные принципы создания и вывода таблиц с использованием HTML-разметки.
Содержание
Базовый синтаксис HTML-таблицы
| Тег | Назначение |
| table | Контейнер для всей таблицы |
| tr | Строка таблицы (table row) |
| td | Ячейка данных (table data) |
| th | Ячейка заголовка (table header) |
Пример простой таблицы
| Месяц | Доход |
|---|---|
| Январь | 100 000 |
| Февраль | 120 000 |
Атрибуты таблицы
- border - определяет границы таблицы
- width - задает ширину таблицы
- cellpadding - отступ внутри ячеек
- cellspacing - расстояние между ячейками
Пример таблицы с атрибутами
| Продукт | Цена | Количество |
|---|---|---|
| Ноутбук | 50 000 | 5 |
| Смартфон | 30 000 | 10 |
Объединение ячеек
| Показатели | |
|---|---|
| 2023 | 100 000 |
| 150 000 | |
Атрибуты объединения
- colspan - объединение столбцов
- rowspan - объединение строк
Стилизация таблицы
| Город | Население |
|---|---|
| Москва | 12 600 000 |
Рекомендации по созданию таблиц
- Используйте семантические теги thead, tbody, tfoot для структуры
- Добавляйте заголовки с помощью th
- Для сложной стилизации применяйте CSS
- Проверяйте таблицу на разных устройствах
