Что такое атрибуты таблиц и их преимущества в HTML?
15 апреля 2022 г.Абстрактный:
HTML (язык гипертекстовой разметки) имеет множество тегов и атрибутов, которые можно использовать для разработки веб-страницы. Атрибуты таблицы являются одним из них. Атрибуты таблицы используются для создания таблиц на веб-страницах. Таблица состоит из данных, по которым легко обобщить информацию. Идем дальше с улыбкой!
Объем:
В этой статье будет рассказано больше об атрибутах таблиц в HTML и их преимуществах. С помощью таблиц у нас есть много преимуществ, например, мы визуализируем наши данные и легко их понимаем. У нас было несколько тегов и стилей для табличных тегов. К концу статьи вы сможете создавать таблицы для веб-страниц. Давайте посмотрим на это больше!
Введение в атрибуты таблицы в HTML:
Атрибуты таблицы в HTML определяются с помощью тега <table>, и он имеет несколько тегов, таких как <tr>, <td>, <th>, <caption>, <thead>, <tbody>, <tfoot> , <colgroup>, <col>… которые используются для заполнения данных в таблицах на наших веб-страницах. Таблицы позволяют разработчикам упорядочивать данные в строки и столбцы.
Давайте поймем атрибуты таблицы и их важность, используя все больше и больше примеров.
Синтаксис:
```разметка
<таблица>
Мы используем такие теги, как <tr>, <th> внутри тегов таблицы.
используется для вставки строки таблицы. используется в качестве заголовков. используется для вставки данных в эту конкретную строку. Пример 1:
(включая <tr>, <th>, <td>)```разметка
<таблица>
Имя Номер рулона Знаки Оперативная память <тд>19-555
90 Дэвид <тд>19-543
95 Рита <тд>19-678
98 ВЫХОД:
**
**Чтобы сделать его более стильным, мы используем атрибуты стиля и теги, такие как
<caption>, добавляем границы, фон…Пример 2:
(включая <tr>, <th>, <td>, а также с использованием атрибута границы)```разметка
<граница таблицы = «1»>
Имя Номер рулона Знаки Оперативная память <тд>19-555
90 Дэвид <тд>19-543
95 Рита <тд>19-678
98 ВЫХОД:
Мы также можем использовать это с свойством CSS.
``CSS
стол, тд, й {
Граница: сплошная 1px;
Мы получаем тот же результат, что и выше.
Пример 3:
(включая <tr>, <th>, <td>, <caption>, а также с использованием атрибута границы)```разметка
<граница таблицы="1">
<заголовок>
Информация об оценках учащихся
Имя Номер рулона Знаки Оперативная память <тд>19-555
90 Дэвид <тд>19-543
95 Рита <тд>19-678
98 <стиль>
подпись {
граница: сплошная 2px;
набивка: 0,7 бэр;
ВЫХОД:
Пример 4:
(добавление цвета фона в любую 2 строку)```разметка
<граница таблицы="1">
<заголовок>
Информация об оценках учащихся
Имя Номер рулона Знаки Оперативная память <тд>19-555
90 Дэвид <тд>19-543
95 Рита <тд>19-678
98 <стиль>
подпись {
граница: сплошная 2px;
набивка: 0,7 бэр;
ВЫХОД:
Пример 4:
(Стили четных и нечетных ячеек HTML-таблицы)```разметка
<граница таблицы="1">
<заголовок>
Информация об оценках учащихся
Имя Номер рулона Знаки Оперативная память <тд>19-555
90 Дэвид <тд>19-543
95 Рита <тд>19-678
98 <стиль>
тд, подпись, й {
набивка: 0,7 бэр;
стол, тд, й {
граница: 1px сплошной зеленый;
поля: 5re;
tr: n-й ребенок (четный) {
цвет фона: rgb (0, 255, 255);
tr: n-й ребенок (нечетный) {
цвет фона: rgba(113, 112, 0, 0,418);
й {
белый цвет;
цвет фона: светло-серый;
подпись {
граница: сплошная 2px;
цвет фона: голубой;
ВЫХОД:
Атрибуты таблицы
| Теги | Определение |
| <таблица> … | Используется для определения таблицы. |
|
… | Используется для определения строки в таблице. || <й> … | Используется для определения ячейки заголовка в таблице. |
|
… | Используется для определения ячейки в таблице. || <заголовок> … | Используется для написания подписи. |
|
…
| Используется выравнивание таблицы по центру |
| Используется для получения заполнения ячейки в таблице ||
...
| Используется для получения границы таблицы ||
…
| Используется для rowspan или colspan в таблице ||
...
| Используется для получения bgcolor для ячейки в таблице ||
…
| Используется для получения интервала между ячейками в таблице ||
| <голова> | Используется для группировки содержимого заголовка в таблице |
| <тело> | Используется для группировки основного содержимого в таблице |
|
| Используется для группировки содержимого нижнего колонтитула в таблице |Преимущества табличных атрибутов в HTML
- Таблицы используются для быстрого и легкого получения информации.
- Таблицы используются для обеспечения эффективной читаемости при отображении строк и столбцов.
- Таблица снижает сложность поиска любой информации и представляет визуальную информацию в удобном формате.
- Мы можем очень быстро и легко добавлять информацию в таблицы по мере поступления новых данных.
Вывод
Теперь мы подошли к концу статьи, здесь мы изучили атрибуты таблиц в HTML и стилизацию таблиц с помощью атрибутов Styling CSS.
Чтобы узнать больше об атрибутах таблицы HTML, посетите Scaler Topics
Биография автора:
[Вайшнави Яда] (https://www.linkedin.com/in/vaishnavi-yada/) из GNITS, Хайдарабад, в настоящее время учится на третьем курсе инженера по специальности «Информатика и инженерия». Я страстно люблю писать технические блоги, разбираясь в HTML, CSS, Python, JS (начинающий), C и т. д., а также пишу несколько блогов на Medium
Оригинал
