Тема 10 Таблиці. Частина 1.

Таблиці. Частина 1.

Пояснення:

Створення простої таблиці

За допомогою тегу <table></table> можна створити таблицю.
Вказавши рядки(<tr></tr>) та клітинки в рядку(<td></td>)

Використання назви таблиці та клітинки-заголовки

Тег <caption></caption> дозволяє надати назву нашій таблиці.
Тег <th></th> пишеться в першому рядку, щоб задати клітинки-заголовки для таблиці.

Властивість border для таблиць

За допомогою властивості border: ставимо рамку для таблиці та рядків.

Розташування таблиці та рядків на сторінці

За допомогою атрибуту align="" вирівнюємо таблицю та її рядки.

Використання зображень та посилань у таблиці

Тег <img></img> вставить картинку у відповідну комірку таблиці.
Тег <a></a> вставить посилання у відповідну комірку таблиці.
Властивість background-color: поставить фон на рядки таблиці.

Таблиця:

№	Тема	Приклад коду	Підсумок
1	Тег <table>	`<body> <table></table> </body>`	Використовується для створення таблиці, яка складається з рядків і клітинок.
2	Тег <tr>	`<body> <table> <tr>Рядок 1</tr> <tr>Рядок 2</tr> </table> </body>`	Додає новий рядок у таблицю, всередині якого розташовуються клітинки.
3	Тег <td>	`<body> <table> <tr> <td>Комірка 1</td> <td>Комірка 2</td> </tr> </table> </body>`	Визначає комірку з даними у таблиці — саме тут пишеться основна інформація.
4	Тег <th>	`<body> <table> <tr> <th>Заголовок 1</th> <th>Заголовок 2</th> </tr> <tr> <td>Дані</td> <td>Дані</td> </tr> </table> </body>`	Створює комірку-заголовок. Текст у <th> автоматично стає жирним і вирівнюється по центру.
5	Тег <caption>	`<body> <table> <caption>Моя таблиця</caption> <tr><td>Дані</td></tr> </table> </body>`	Додає назву до таблиці, яка відображається зверху над нею.

build info

compiler: 2.0.5.1 · 4054EF9BF6C4510A
built: 2026-11-08 14:31:25 UTC