HTML <table> Тег
Пример
Простая HTML-таблица, содержащая два столбца и две строки:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
Подробнее примеры ниже.
Определение и использование
Тег <table> определяет таблицу HTML.
Таблица HTML состоит из элемента <table> и одного или нескольких <tr>, <th>, и <td> элементов.
Элемент <tr> определяет строку таблицы, элемент <th> определяет заголовок таблицы, а элемент <td> определяет ячейку таблицы.
Более сложная HTML-таблица может также включать <caption>, <col>, <colgroup>, <thead>, <tfoot>, и <tbody> элементы.
Примечание: Таблицы не должны использоваться для макета страницы! Исторически сложилось так, что некоторые веб-авторы имеют неиспользуемые таблицы в HTML как способ управления их макета страницы. Однако существуют различные альтернативы использованию HTML-таблиц для макета, в первую очередь с использованием CSS.
Поддержка браузера
Элемент | |||||
---|---|---|---|---|---|
<table> | Да | Да | Да | Да | Да |
Различия между HTML 4,01 и HTML5
Атрибуты "align", "bgcolor", "border", "cellpadding", "cellspacing", "frame", "rules", "summary", and "width" не поддерживается в HTML5.
Атрибуты
Атрибут | Значение | Описание |
---|---|---|
align | left center right |
Не поддерживается в HTML5. Задает выравнивание таблицы в соответствии с окружающим текстом |
bgcolor | rgb(x,x,x) #xxxxxx colorname |
Не поддерживается в HTML5. Задает цвет фона для таблицы |
border | 1 0 |
Не поддерживается в HTML5. Указывает, используется ли таблица для целей компоновки |
cellpadding | pixels | Не поддерживается в HTML5. Определяет расстояние между стеной ячейки и содержимым ячейки |
cellspacing | pixels | Не поддерживается в HTML5. Задает пространство между ячейками |
frame | void above below hsides lhs rhs vsides box border |
Не поддерживается в HTML5. Определяет, какие части внешних границ, которые должны быть видимы |
rules | none groups rows cols all |
Не поддерживается в HTML5. Определяет, какие части внутренней границы должны быть видимы |
summary | text | Не поддерживается в HTML5. Задает сводку содержимого таблицы |
width | pixels % |
Не поддерживается в HTML5. Задает ширину таблицы |
Глобальные атрибуты
Тег <table> также поддерживает Глобальные атрибуты в HTML.
Атрибуты события
Тег <table> также поддерживает Атрибуты событий в HTML.
Попробуйте примеры
Заголовки таблицТаблица с подписью
Создание заголовков таблиц.
Таблица с подписью
Таблица HTML с подписью.
Теги внутри таблицы
Отображение элементов внутри других элементов.
Ячейки, которые охватывают более одной строки/столбца
Определение ячеек таблицы, охватывающих более одной строки или одного столбца.
Похожие страницы
HTML Учебник: HTML Tables
HTML DOM Ссылки: Table Object
CSS Учебник: Styling Tables
Параметры CSS по умолчанию
В большинстве обозревателей элемент <table> будет отображаться со следующими значениями по умолчанию:
Пример
table {
display: table;
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}