Добро пожаловать на сайт все о Web-разработке

На сайте все о Web-разработке вы найдёте очень много интересной и полезной информации

HTML

Гиперссылки

Формы

Таблицы

Списки

Html изображения

HTML-таблицы

HTML-таблицы упорядочивают и выводят на экран данные с помощью строк или столбцов. Таблицы состоят из ячеек, образующихся при пересечении строк и столбцов.

Ячейки таблиц могут содержать любые HTML-элементы, такие как заголовки, списки, текст, изображения, элементы форм, а также другие таблицы. Каждой таблице можно добавить связанный с ней заголовок, расположив его перед таблицей или после неё.

Таблицы больше не используются для вёрстки веб-страниц и компоновки отдельных элементов, потому что такой приём не обеспечивает гибкость структуры и адаптивность сайта, существенно увеличивая HTML-разметку.

Создание таблиц

Таблица создаётся при помощи элемента < table >< /table >, который является контейнером для элементов таблицы и все элементы должны находиться внутри него.

Например, с помощью данной разметки можно создать таблицу, состоящую из двух столбцов и двух строк:

По умолчанию таблица и ячейки не имеют видимых границ. Границы задаются с помощью свойства border:

Промежутки между ячейками таблицы убираются с помощью свойства table {border-collapse: collapse;}.

Ширина таблицы по умолчанию равна ширине её внутреннего содержимого. Чтобы установить ширину, нужно задать значение для свойства width:

Если для ячеек таблицы заданы внутренние отступы и границы, то ширина таблицы будет включать в себя следующие значения: padding-left и padding-right, ширина border-left плюс ширина border-right последней ячейки в ряду.

Если заданы ширина и границы ячеек, то ширина таблицы будет складываться из ширины ячеек плюс ширина border-left и ширина border-right последней ячейки в ряду.

Как сделать ячейку заголовка столбца таблицы

Элемент < th > создаёт заголовок столбца — специальную ячейку, текст в которой выделяется полужирным. Количество ячеек заголовка определяется количеством элементов < th >< /th >. Для элемента доступны атрибуты colspan, rowspan, headers.

Как сделать ячейку тела таблицы

Элемент < td > создаёт ячейки таблицы, внутрь которых помещаются данные таблицы. Элементы < td >< /td> , расположенные в одном ряду, определяют количество ячеек в строке таблицы.

Количество пар ячеек < td > должно быть равно количеству пар ячеек < th> . Для элемента доступны атрибуты colspan, rowspan, headers.