Эта статья предоставит вам подробные и всесторонние знания таблиц HTML. Различные теги и форматирование, которые можно сделать.
С момента появления технологии таблица является обычным способом хранения и визуализации данных. Он используется почти во всех полях для представления текстовой информации и числовых данных, где вы можете легко сравнить два или более элементов. В этой статье я буду обсуждать Таблицы в следующем порядке:
Проще говоря, таблица - это набор связанных данных, состоящий из строк и столбцов. Теперь, как мы знаем, HTML - это стандартный язык разметки для создания веб-страниц и их отображения в веб-браузере. Таким образом, создание таблиц и работа с ними становится важным вспомогательным навыком для освоения HTML. В этом блоге мы узнаем, как работать с таблицами в HTML.
Чтобы определить таблицу HTML, мы используем
тег. Внутри
, вы сначала определяете строки таблицы с помощью
тег. Затем вы определяете заголовки таблиц в
тег. Данные или ячейка в таблице определяются с помощью
тег.
Теги таблицы HTML
Давайте сначала посмотрим на список тегов HTML, используемых для создания таблиц. Позже, продвигаясь в этом блоге, мы узнаем, как их использовать, с помощью примеров.
: Используется для определения таблицы
: Используется для определения ячейки заголовка в таблице
: Используется для определения строки в таблице
: Используется для определения ячейки в таблице
:Используется для определения заголовка таблицы
:Используется для указания группы из одного или нескольких столбцов в таблице для форматирования
: Используется для указания свойств столбца для каждого столбца в элементе
:Используется для группировки содержимого заголовка в таблице
: Используется для группировки содержимого тела в таблице
: Используется для группировки содержимого нижнего колонтитула в таблице
Теперь давайте посмотрим на образец HTML-кода для создания таблицы.
имя
Возраст
Абхишек
18
Боб
2. 3
Вывод:
Варианты HTML-таблицы
Атрибуты Cellpadding и Cellspacing
Есть два атрибута, называемые cellpadding и cellspacing, которые вы можете использовать для настройки белого пространства в ячейках таблицы. Атрибут cellspacing определяет расстояние между ячейками таблицы, а cellpadding представляет расстояние между границами ячеек и содержимым внутри ячейки.
Пространство ячеек и заполнение ячеек
имя
Возраст
Абхишек
15
Боб
2. 3
Атрибуты Colspan и Rowspan
Атрибут Colspan используется для объединения двух или более столбцов, тогда как rowspans используется для объединения двух или более строк.
Colspan и Rowspan
Партия
имя
Возраст
Информатика
Абхишек
15
Боб
2. 3
Перерыв
Высота и ширина стола
HTML дает вам возможность регулировать высоту и ширину таблицы. Атрибут ширины и атрибут высоты используются для установки ширины и высоты таблицы соответственно. Вы можете указать это в процентах от площади, доступной на экране, или в пикселях.
Ширина и высота таблицы HTML
Абхишек
15
Боб
2. 3
Верхний колонтитул, текст и нижний колонтитул таблицы
Таблицу можно разбить на три части: заголовок, тело и нижний колонтитул. Верхний и нижний колонтитулы похожи на верхний и нижний колонтитулы в текстовом документе, который остается общим для каждой страницы, тогда как тело содержит основное содержимое.
тег создает отдельный заголовок таблицы, тогда как тег создает отдельный нижний колонтитул таблицы. теги содержат тело таблицы.
Таблица HTML с заголовком, нижним колонтитулом и телом
Заголовок таблицы
Нижний колонтитул таблицы
имя
Возраст
Метки
Фоны стола и заголовки
Вы также можете установить фон таблицы. Bgcolor Атрибут устанавливает цвет фона для всей таблицы, а также для одной ячейки, тогда как атрибут background устанавливает фоновое изображение для всей таблицы, а также только для одной ячейки.
Тег заголовка служит заголовком или объяснением таблицы, которая отображается в верхней части таблицы.
Фон таблицы HTML
Заголовок таблицы
Столбец 1
Колонка 2
Колонка 3
Ряд 1 Ячейка 1
Ряд 1 Ячейка 2
Ряд 1 Ячейка 3
Строка 2, ячейка 2
Строка 2, ячейка 3
Строка 3 Ячейка 1
На этом мы подошли к концу данной статьи. Теперь, после выполнения приведенных выше фрагментов, вы бы поняли, как создавать таблицы в HTML. Я надеюсь, что этот блог будет информативным и принесет вам дополнительную пользу.
Проверьтеот Edureka, надежной компании по онлайн-обучению с сетью из более чем 250 000 довольных учащихся по всему миру.Курс по сертификации веб-разработки поможет вам научиться создавать впечатляющие веб-сайты с помощью HTML5, CSS3, Twitter Bootstrap 3, jQuery и API Google и развертывать их в Amazon Simple Storage Service (S3).
Есть вопрос к нам? Пожалуйста, укажите это в комментариях к этой статье, и мы свяжемся с вами.