Робота з таблицями

6 Робота з таблицями

6.1 Що таке таблиця

Таблиця складається з комірок, що утворюються при перетині рядків і стовпців. Розглянемо коротко елементи таблиці:

осередок це основний елемент таблиці. Осередок формується перетином рядка і стовпця;
рядок - це набір осередків, розташованих одна за одною горизонтально;
стовпець - це набір осередків, розташованих одна над іншою вертикально;
межа - це лінія, яка оточує кожну клітинку і таблицю в цілому.

У стандартній таблиці кожен рядок і кожен стовпець містять однакову кількість осередків. Однак таблиці можуть дуже сильно відрізнятися від стандартної.

6.2 Створення таблиці

Основний тег, що описує таблицю - парний тег

. Всі елементи таблиці повинні знаходитися всередині тегів

Тепер приступимо до створення осередків таблиці. Для початку потрібно поставити необхідну кількість рядків, а потім розділити рядки стовпцями на осередки. Кількість пар тегів і визначає кількість горизонтальних рядків в таблиці. Кількість пар тегів і . розташованих між тегами відповідного рядка, визначає кількість осередків (стовпців) в межах рядка.

тег дозволяє створити заголовок - спеціальне відділення, яка буде виділятися напівжирним. Для цього текст заголовка поміщають всередину тега . Наприклад, запис текст заголовка призведе до форматування тексту всередині тега напівжирним шрифтом.

Розглянемо приклад таблиці, яка складається з трьох рядків і трьох стовпців, причому осередки першого рядка є заголовками відповідних стовпців.

У розглянутому вище прикладі таблиця і осередки не мають видимих кордонів. Кордон таблиці створюється за допомогою атрибута border тега

. Ширина кордону вказується в пікселях. Якщо атрибут border не вказано, то таблиця виводиться без видимої рамки. Атрибут bordercolor дозволяє задати колір межі таблиці, вказавши код кольору.

Щоб кожен раз при створенні таблиці не прописувати всі необхідні атрибути, рекомендується задати параметри з оформлення таблиці за допомогою каскадних таблиць стилів (CSS).

Щоб зробити кордону видимими, додайте наступний код в ваш css файл: Результат:

6.3 Об'єднання осередків таблиці

Об'єднання осередків відбувається за допомогою атрибутів colspan і rowspan. Атрибут colspan задає кількість осередків, об'єднаних по горизонталі, а rowspan - по вертикалі. тег

створює підпис таблиці. Додається безпосередньо після тега . поза описом рядка або комірки.

Електронно-навчальний курс з дисципліни "Web - технології"