Таблиці в html - html по кроках
Таблиці досить широко застосовуються при створенні веб-сторінок: вони служать не тільки способом подання та впорядкування даних, а й є інструментом форматування сторінок - їх використовують для створення каркаса сторінки - застосовують табличну верстку.
Визначення у Вікіпедії: Табличная верстка - умовна назва методу верстки HTML-документів, при якому в якості структурної основи для розташування текстових і графічних елементів документа використовуються таблиці (тобто HTML-тег
).
Якщо коротко, то при табличній верстці створюється таблиця, що займає в основному всю ширину вікна браузера, в кожному осередку якої розташовується той чи інший елемент (або елементи) сторінки.
Створення таблиці: рядки та клітинки. заголовок таблиці
Таблиця створюється за допомогою тега
- він відкриває таблицю. обов'язковий тег
інформує браузер про завершення таблиці.
Будь-яка таблиця складається з стовпців і рядків.
тег
створює рядок, а тег | осередок в рядку. Відповідно скільки осередків включено в рядок, стільки буде й стовпців в таблиці.
тег | також створює осередок. Його відмінність від тега | в тому, що осередок створена тегом | є осередком - заголовком: її вміст розташовується по центру, а якщо це текст, то браузер відображає його жирним шрифтом.
Вміст комірки, створеної тегом | за замовчуванням розташовується в її лівій Чаcть.
тег створює заголовок таблиці, він розташовується всередині тега - відразу після відкриваючого тега. Тема за замовчуванням розташовується над таблицею і вирівнюється по її центру.
заголовок таблиці 1-а група 1-го рядка | 2-а група 1-ої рядка | 1-а група 2-ий рядки | 2-а група 2-го рядка | | |
1-а група 1-го рядка
Як видно з прикладу: вказуючи ширину однієї з комірок стовпчика, Ви тим самим задаєте ширину всього стовпчика; і, вказуючи висоту однієї з осередків рядка, Ви задаєте висоту всього рядка.
Межі таблиці і осередків
Таблиця і кожна її осередок мають свої власні кордони, які за умовчанням не видно.
Атрибут border тега дозволяє зробити кордону видимими і задати їх товщину. При цьому будуть відображені кордону і навколо таблиці і навколо кожного осередку.
Товщина кордону (або рамки) задається в пікселях. Як значення атрибута border вказується ціле позитивне число. Якщо атрибут border вказано без значення, товщина рамки складе 1 піксель.
Товщина кордону задається тільки для таблиці. Товщина рамки навколо осередків завжди становить 1 піксель (або відсутня).
За замовчуванням межа відображається з ефектом тривимірності і має чорний колір.
Атрибут bordercolor задає колір кордону і усуває ефект тривимірності. Атрибут може використовуватися для завдання кольору кордону таблиці (тег ), Рядки (тег ) Або осередки (тег | ).
Атрибут bordercolor підтримується не всіма браузерами і тому не рекомендується його використовувати. Для завдання кольору кордону краще скористатися стилями (це вже в CSS).
Атрибут border не вказано. | Тому кордони відсутні. | | | Товщина кордону таблиці становить 3 пікселя. | Осередки мають кордону товщиною 1 піксель! | | |
Атрибут border не вказано.
Тому кордони відсутні.
Cookie на сайті
Ми використовуємо cookie для коректної роботи сайту та покращення сервісу.
| |