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

Об'єднання осередківтаблиць найкраще розглянути на прикладі простої таблиці, HTML-код якої наведено у лістингу 5.10.

таблиць

Це звичайна таблиця, комірки якої пронумеровані – так нам буде простіше надалі. На рис. 5.2 показаний її вигляд у вікні Web-браузера.

А тепер розглянемо таблицю на рис. 5.3.

Тут виконано об'єднання деяких осередків. Видно, що об'єднані осередки немов злилися в одну. Як це зробити?

Спеціально для цього тегиі підтримують два дуже примітні необов'язкові атрибути. Перший - COLSPAN - об'єднує осередки по горизонталі, другий - ROWSPAN - по вертикалі.

осередки

Щоб поєднати кілька осередків по горизонталі в одну, потрібно виконати такі кроки.

1. Знайти у коді HTML тег( ), відповідний першою з комірок, що об'єднуються (якщо вважати осередки зліва направо).

2. Вписати в нього атрибут COLSPAN і привласнити йому кількість комірок, що об'єднуються, вважаючи і найпершу з них.

3. Видалити теги( ), Що створюють інші об'єднуються осередки цього рядка.

Давайте об'єднаємо комірки 2 та 3 таблиці (див. листинг 5.10). Виправлений фрагмент коду, який створює перший рядок цієї таблиці, наведено у лістингу 5.11.

єднання

Так само створимо об'єднані осередки 4 + 5 і 12 + 13 + 14 + 15.

Об'єднати осередки по вертикалі трохи складніше. Ось кроки, які потрібно для цього виконати.

1. Знайти в коді HTML рядок (тег), в якій знаходиться перша з комірок, що об'єднуються (якщо вважати рядки зверху вниз).

2. Знайти у коді цього рядка тег( ), що відповідає першому з комбінованих осередків.

3. Вписати в нього атрибут ROWSPAN і привласнити йому кількість об'єднаних осередків, вважаючи інайпершу з них.

4. Переглянути наступні рядки та видалити з них теги( ), Що створюють інші комірки, що об'єднуються.

Нам залишилося об'єднати комірки 1 і 6 нашої таблиці. Лістинг 5.12 містить виправлений фрагмент її HTML-коду (виправлення торкнуться першого і другого рядка).

осередків

Звернемо увагу, що ми видалили з другого рядка тег, що створює шостий осередок, оскільки він об'єднався з першим осередком.

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