Обрамлення таблиці

Атрибут BORDER дескриптора <TABLE> дозволяє заключити таблицю у рамку. При відтворенні таблиці її стовпчики та стрічки будуть відокремлені один від одного лініями.

Визначаючи рамку таблиці, слід вказати товщину її зовнішніх ліній у пік селях. По замовчуванню Web-браузер відображає рамку таблиці темно-сірим кольором. Щоб змінити колір рамки таблиці, потрібно застосувати атрибут BORDERCOLOR.

Наприклад,

<TABLE BORDER=”10” BORDERCOLOR=”maroon”>

Визначення заголовка таблиці

Дескриптор <CAPTION> дозволяє дати таблиці заголовок, що уточнює її призначення та зміст.

По замовчуванню Web-браузери розміщують заголовок таблиці по центру над нею. Атрибут ALIGN зі значенням bottom дає можливість перенести заголовок безпосередньо під таблицю.

Наприклад,

<TABLE BORDER=”10”>

<CAPTION><I>Товари та ціни</I></CAPTION>

<TR>

<TH>Назва товару</TH>

<TH>Ціна 1 шт. </TH>

<TH>Кількість на складі</TH>

</TR>

<TR>

<TD>Олівці</TD>

<TD>1 грн. </TD>

<TD>100</TD>

</TR>

</TABLE>

відобразиться браузером:

Товари та ціни

Назва товару Ціна 1 шт. Кількість на складі
Олівці 1 грн.  

Якщо замість другої стрічки задати:

<CAPTION ALIGN = bottom ><I>Товари та ціни</I></CAPTION>,

то заголовок буде під таблицею.

Групування стовпчиків таблиці

Дескриптори <COLGROUP> і <COL> надають можливість групування стовпчиків таблиці. Групи стовпчиків розділяють таблицю на множини вертикально розміщених комірок, ознаки форматування яких можуть встановлюватись одночасно.

Дескриптор <COLGROUP> створює структурну групу стовпчиків, яка виділяє множину логічно однорідних комірок. Наприклад, одна структурна група може охоплювати комірки заголовків стрічок, а інша – комірки, що містять дані. Щоб створити структурну групу стовпчиків, потрібно дескриптору <COLGROUP> надати атрибут SPAN, присвоївши йому значення кількості стовпчиків, які потрібно включити у групу.

Наприклад,

<H2> <CENTER>Товари та ціни</CENTER></H2>

<TABLE BORDER=”10”>

<COLGROUP SPAN=“1”> </COLGROUP>

<COLGROUP SPAN=“2”> </COLGROUP>

<TR>

<TH>Назва товару</TH>

<TH>Ціна 1 шт. </TH>

<TH>Кількість на складі</TH>

</TR>

<TR>

<TD>Олівці</TD>

<TD>1 грн. </TD>

<TD>100</TD>

</TR>

<TR>

<TD>Ручки</TD>

<TD>5 грн. </TD>

<TD>200</TD>

</TR>

</TABLE>

відобразиться браузером:


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: