69695

ТАБЛИЦІ

Лекция

Информатика, кибернетика и программирование

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

Украинкский

2014-10-08

462.5 KB

0 чел.

Тема 15: Розділ 12 ТАБЛИЦІ

Мета: навчитись представляти інформацію у HTML-документі у вигляді таблиць.

Табличні теги мови HTML дозволяють подавати дані у зручній для сприйняття формі.

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

Для створення таблиці використовують тег <TABLE> і відповідний йому закриваючий тег </TABLE>. Між ними розташовані всі теги, необхідні для створення таблиці.

Комірка, яка містить елемент даних, задається парою тегів <TD> і </TD>.

Теги для побудови таблиці

Тег

Призначення

<CAPTION> ...</CAPTION>

заголовок до таблиці

<TABLE> ...<TABLE>

визначає початок таблиці

_<TR>... </TR>

визначає рядок таблиці

!<TD>... </TD>

визначає елемент даних таблиці

Тег <TABLE> може мати атрибут рамки BORDER=n, який ство-Рює рамку шириною п пікселів. За замовчуванням таблиця не ок-Реслена рамкою. У тегу <TABLE> можна використати атрибут BORDERCOLOR для кольору рамки таблиці. Атрибут BORDERCOLOR дорівнює шістнадцятковому RGB або англійській Назві кольору.

У тегу <TD> можна використати атрибут BGCOLOR, який задає Колір фону комірки таблиці.

Оскільки таблиці будуються з рядків, між тегами <TR> і </TR> Розташовуються всі елементи, необхідні для створення рядка таблиці.

Для створення заголовків стовпчиків даних використовуються теги <ТН> і </ТН>, текст в яких автоматично виводиться жирним шрифтом з вирівнюванням по центру.

Атрибут COLSPAN (Column Span) дозволяє здійснювати об'єднання стовпчиків. Якщо необхідно створити яку-небудь комірку, ширшу, від верхньої чи нижньої, за допомогою атрибута COLSPAN= ц можна розтягнути над будь-якою кількістю звичайних комірок.

ПРИКЛАД:

<TR>

<TD BGCOLOR=WHITE COLSPAN=2>

Приклад застосування атрибута об'єднання комірок

</TD>

</TR>

Атрибут UNIT= тега <TABLE> визначає одиниці вимірювання, які використовуються при зазначенні розмірів як всієї таблиці, так і окремих стовпчиків. Атрибут UNIT= може приймати такі значення:

UNIT=EN - це значення надається за замовчуванням і визначає одиницю вимірювання, яка дорівнює еп-пробілу. En-пробіл – це друкарська одиниця вимірювання, яка дорівнює ширині літери <п>. Реальний розмір пробілу залежить від обраного шрифту. Як правило, en-пробіл дорівнює половині розміру шрифту;

UNIT=RELATTVE - використовується для визначення відносної ширини стовпчиків у процентах від загальної ширини таблиці;

UNIT=PIXELS - це значення використовується, якщо необхідно точно визначити ширину стовпчика на екрані. Наприклад, тег <TABLE UNIT=PIXELS WIDTH=340> сформує таб- 1 лицю шириною 340 пікселів.

Атрибут CELLPADDING= визначає ширину порожнього просто-  ; ру між вмістом комірки і її межами, тобто задає поля всередині комірки.

ПРИКЛАД

<TABLE BORDER CELLPADDING=20>

<TR>

<TD>TeKCT або дані</ГО>

</TR>

ПРИКЛАД

файл у форматі HTML:

<HTML>

<HEAD>

<ТІТЬЕ>Моя перша НТМЬ-сторінка</ТІТЬЕ>

</HEAD>

<BODY>

<CAPTION>

<H2><P AL1GN=CENTER> НАРОДНІ ЗНАННЯ </Р></Н2>

</CAPTION>

<TABLE BORDER=1>

<TR>

<ТН>Система народних знань</ТН>

<ТН>Зміст</ТН>

</TR>

<TR>

<TD ALIGN=CENTER>

<В><І>Народнаастрономія</В></І></ГО>

<TD ALIGN=LEFT>Астрономія як наука була відома в Україні ще у XVII ст. і викладалась у братських школах. Самобутня астрономічна номенклатура українців засвідчує їхню добру обізнаність з основними сузір'ями. </TD>

</TR>

<TR>

<TD ALIGN=CENTER>

<B> <I> Народна метеорологія </В></І>

</TD>

<TD ALIGN=LEFT> Одна з найдавніших галузей народних знань, що обіймає систему прикмет, раціональних спостережень і достовірних передбачень про погодні зміни на близький чи віддалений час. Широко побутували прикмети, що дозволяли прогнозувати погодні зміни протягом найближчого часу за особливостями сходу і заходу Сонця, його кольору, за виглядом нічного неба, яскравістю зірок і Місяця тощо.

</TD>

</TR>

</TABLE>

</BODY>

</HTML>

Відображення файла програмою-броузером:

Розширені можливості розмітки таблиці

ОБ'ЄДНАННЯ РЯДКІВ ТА СТОВПЧИКІВ Використання атрибуту ROWSPAN для об'єднання рядків

ROWSPAN=n (n - ціле число, за замовчуванням п=1) визначає кількість рядків таблиці, які перекриває комірка.

ПРИКЛАД 1

Тема 1 _  о Тема З Тема 2

Тема 4     Тема 5

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<TD>TeMa 1</TD>

<TD ROWSPAN=2>TeMa 2</TD>

<TD>TeMa 3</TD> </TR> <TR>

<TD>TeMa 4</TD> <ТБ>Тема 5</TD> </TR> </TABLE>

ПРИКЛАД 2

Г Тема 2    Тема 3    Тема 4

(Тема 1

Тема 5    Тема 6    Тема 7

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<TD ROWSPAN=2>TeMa 1</TD>

<ТБ>Тема 2</TD> <TD>Tem 3</TD> <ТБ>Тема 4</ТD> </TR> <TR>

<TD>TeMa 5</TD> <TD>TeMa 6</TD> <TD>TeMa 7</TD> </TR> </TABLE>

Використання атрибуту COLSPAN для об'єднання стовпчиків

COLSPAN=n (n - ціле число, за замовчуванням п=1) визначає кількість стовпчиків таблиці, які перекриває комірка.

ПРИКЛАД і

РГемаї Тема 2

Тема 3 Тема 4 Тема 5 \

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<ТБ>Тема 1</TD> <TD COLSPAN=2>TeMa 2</TD> </TR> <TR>

<TD>TeMa 3</TD> <TD>TeMa 4</TD> <ТБ>Тема 5<ДБ> </TR> </TABLE>

ПРИКЛАД 2

Тема 1 Тема 2 Тема З

Тема 4 Тема 5

Тема 6 Тема 7

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<TD>TeMa K/TD><TD>TeMa 2</D><TD>TeMa 3</TD> </TR>

<TR>

<TD>Te\ia 4</TD>

<TD C0LSPAN-2>TeMa 5</TD> </TR> <TR>

<TD C0LSPAN=2>TeMa 6</TD> <TD>TeMa 7</TD> </TR> </TABLE>

Одночасне використання ROWSPAN ma COLSPAN 

ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<TD ALIGN=center ROWSPAN=2 COLSPAN=2>A</TD> <TD>K/TD>

<TD>2</TD> </TR> <TR>

<TD>3</TD>

<TD>4</TD> </TR> <TR>

<TD ALIGN=center ROWSPAN=2 C0LSPAN=2>C</TD> <TD ALIGN=center R0WSPAN=2 COLSPAN=2>D</TD> </TR> <TR>

</TR>

</TABLE>

Створення в таблицях заголовків для стовпчиків Для розмітки заголовків у таблицях слід використовувати тег <ТН>. При використанні цього тегу заголовок буде виділено жирним шрифтом та відцентровано в межах комірки.

ПРИКЛАД

(Заголовок 1 {Заголовок 2 {Заголовок З

[Шин ІДва |Три

[Чотири         [П'ять (Шість

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<ТН>Заголовок1</ТН> <ТН>Заголовок 2</ТН>

<ТН>Заголовок 3</ТН> </TR> <TR>

<ТО>Один</ТО> <ТО>Два</ТО> <TD>Tpn</TD> </TR> <TR>

<TD>4orapH</TD> <ТО>П'ять</ТО> <TD>micrb</TD>

</TR> </TABLE>

ОДНОЧАСНЕ ВИКОРИСТАННЯ ЗАГОЛОВКІВ ДЛЯ СТОВПЧИКІВ ТА ОБ'ЄДНАННЯ СТОВПЧИКІВ

ПРИКЛАД

Заголовок 1 Заголовок 2

Один Два     Три Чотири і П'ять Шість |Сім Вісім

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<TH COLSPAN=2> ЗаголовокК/ТН> <TH COLSPAN=2> Заголовок2</ТН> </TR> <TR>

<TD>Ohhh</TD> <ТВ>Два</ТБ> <TD>TpH</TD> <TD>4othPh</TD> </TR> <TR>

<TD>n'm-b</TD> <TD>micTb</TD> <TD>CiM</TD> <TD>BidM</TD>

</TR> </TABLE>

Багаточисельні заголовки стовпчиків та об'єднання стовпчиків ПРИКЛАД

фрагмент файла у форматі HTML:

STABLE BORDER> <TR>

<TH COLSPAN=2>3anMOBOKl</TH> <ТН СОЬ8РАК=2>Заголовок2</ТН> </TR> <TR>

<ТН> Заг 3</ТН> <ТН> Заг 4</ТН> <ТН> Заг 5</ТН> <ТН> Заг 6</ТН> </TR> <TR>

<ТБ>Один</ГО> <ТБ>Два</ТО> <TD>TpH<^D> <TD>4othph</TD> </TR> <TR>

<TD>n'HTb</TD> <TD>micTb</TD> <TD>Om</TD> <TD>BiciM</TD>

</TR> </TABLE>

Бокові заголовки ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLE BORDER>

<TR><TH>Зaгoлoвoк 1</ТН>

<TD>Texia 1</TD> <TD>Te\ia 2</TD> <ТБ>Тема З </TDx/TR>

<TR><TH>Зaгoлoвoк2</TH>

<TD>Te\fa 4</TD> <TD>TeMa 5</TD> <ТБ>Тема 6 </TDx/TR>

<TR><TH>ЗaгoлoвoкЗ</TH>

<TD>Te.\ia 7</TD> <TD>TeMa 8</TD> <ТБ>Тема 9 </TD></TR> </TABLE>

Бокові заголовки та об'єднання рядків (ROWSPAN) ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLEBORDER>

<TR><TH ROWSPAN=2>3aiwiOBOKl</TH>

<TD>Te\ia 1</TD> <TD>TeMa 4</TD> <TD>Te\ia 7</TD> 1 <TD>Te\ia 10</TD> </TR>

<TR><TD>TeMa 2</TD> <ТБ>Тема 5</TD> <TD>TeMa 8 </TD> <TD>TeMa 11</TD> </TR> <TR><TH>Зaгoлoвoк2</TH>

<ТБ>Тема 3</TD> <TD>Te\m 6</TD> <TD>Tewa 9</TD> <TD>TeMa 12</TD>

</TR> </TABLE>

Використання різних заголовків та об'єднання рядків та стовпчиків ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLE BORDER>

<TR>   <TD>&nbsp</TD><TH ftOWSPAN-2>&nbspfC/TH>

<TH COLSPAN=2>Cepe4Hi</TH>

</TR>

<TR>    <TD>&nbsp</TD><a4H>3pin</rfI><TH>Baia</ll i>

</TR>

<TR>    <TH ROWSPAN=2> Стагь</ТН>

<ТН>Чоловіки</ГНхТО> t .9</ГО><ТТ»0.003</Т D>

</TR>

<TR>    <ТН>Жінки<ТО>1.7</TD><TD>0.002</Tt)>

</TR> <ЯАВЬЕ> <TABLEBORDER>

ВИРІВНЮВАННЯ, ВІДСТУПИ, РАМКИ Таблиця без рамки

ПРИКЛАД

Тема 1 „      _ Тема З

Тема 2
Тема 4
ГІ ема 5

Фрагмент файла у форматі HTML:

<TABLE>

<TR> <TD>TeMa 1</TD> <TD ROWSPAN=2>TeMa 2</TO> <TD>TeMa3</TD>

</TR>

<TR>      <TD>Te\ia 4</TD> <TD>Te\m 5</TD>

</TR> </TABLE>

Таблиця з рамкою

Ширина рамки регулюється в тегу <TABLE> за допомогою атрибуту BORDER=n (n - ціле число, дорівнює ширині рамки в піксе-їях).

Фрагмент файла у форматі HTML:

<TABLE BORDER=10>

<TR>        <ТБ>Тема 1</TD> <TD> Тема 2</TD> </TR>

<TR>       <TD>TeMa 3</TD> <ТБ>Тема 4</TD> </TR> </TABLE>

Відстань між комірками таблиці та відстань між вмістом комірки і її рамкою

Проміжок між вмістом комірки та рамкою навкруги комірки регулюється в тегу <TABLE> за допомогою атрибуту CELLPADDING=n (n - ціле число пікселів).

ПРИКЛАД 1

Фрагмент файла у форматі HTML:

<TABLE BORDER CELLPADDING=10 CELLSPACING=O> <TR>

<TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR>

<TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE>

Для зміни відстані між комірками таблиці слід в тезі <TABLE> використовувати атрибут CELLSPACING=n (n - ціле число, дорівнює кількості пікселів між комірками таблиці).

ПРИКЛАД 2

Фрагмент файла у форматі HTML:

<TABLE BORDER CELLPADDING=O CELLSPACINGS 0> <TR>

<TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR>

<TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE>

ПРИКЛАД З

Фрагмент файла у форматі HTML:

<TABLE BORDER CELLPADDING=10 CELLSPACING» 10> <TR>

<TD>A</TD> <TD>B</TD> <TD>C</TD>

</TR> <TR>

<TD>D</TD> <TD>E</TD> <TD>F</TD>

</TR> </TABLE>

ПРИКЛАД 4

Фрагмент файла у форматі HTML:

<TABLE BORDER=5 CELLPADDING=10 CELLSPACING=10> <TR>

<TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR>

<TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE>

Розташування інформації в комірках таблиці у декілька рядків ПРИКЛАД

Січень Лютий Березень

Це перша Друга Інша комірка,

комірка комірка третя

 - - - - ...   -     -..   ; .. .   ■

Четверта комірка    епеРце Шоста комірка

п ята комірка ^     :

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<ТН>Січень</ТН> <ТН>Лютий</ТН> <ТН>Березень</ТН> </TR>

<TR>

<TD>IJ,e перша KOMipKa</TD> <ТБ>Друга комірка</ТО> <ТБ>Інша комірка,<Ьг> третя</ТБ>

</TR>

<TR>

<ТО>Четверта KOMipKa</TD> <TD>Tenep це<Ьг>п'ята комірка</ГО> <TD>IUocTa комірка</ТО>

</TR> </TABLE>

Горизонтальне вирівнювання інформації

Вирівнювання інформації в комірках таблиці визначається за допомогою атрибуту ALIGN=LEFT|RIGHT|CENTER, який може приймати значення LEFT (ліворуч), CENTER (по центру), RIGHT (праворуч). Атрибут горизонтального розташування інформації в комірці ALIGN може застосовуватись до окремих комірок, до всього рядка або до всієї таблиці. Залежно від того, де використано цей атрибут (в <TABLE>, <TR> або <TD>) відповідно буде проведено вирівнювання інформації у всій таблиці, у рядку або у окремій комірці.

ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLE BORDER> <TR>

<ТН>Січень</ТН> <ТН>Лютий</ТН>

<ТН> Березень</ТН> </TR>

<TR ALIGN=center>

<TD>Becb рядок <ВИ>розташовано по <BR>4eHTpy</TD> <ТО>Друга комірка</ТО> <TD>lHina комірка,<Ьг>третя</ТО> </TR> <TR>

<TD ALIGN=right>Po3TamoBaHO <BR>npaBOpV4</TD> <TD ALIGN=center>Po3TamoBaHO по центру</ГО> <TD> За замовчуванням,<Ьг> розташовано ліворуч</ТО> </TR> </TABLE>

Вертикальне вирівнювання інформації

Вертикальне вирівнювання інформації в комірках таблиці визначається за допомогою атрибуту VALIGN=TOP|BOTTOM|MIDDLE, який може приймати значення ТОР (догори), BOTTOM (донизу), MIDDLE (по середині). Атрибут вертикального розташування інформації в комірці VALIGN може застосовуватись до окремих комірок, до всього рядка або до всієї таблиці. Залежно від того, де використано цей атрибут (в <TABLE>, <TR> або <TD>) відповідно буде проведено вирівнювання інформації у всій таблиці, у рядку або в окремій комірці.

ПРИКЛАД

Січень

Лютий

Березень

Всі комірки рядка

Друга

Третя комірка

розташовані

комірка

зверху

Розташовано

зверху

За замовчуванням,

розташовано по

Розташовано

центру

знизу

Фрагмент файла у форматі HTML:

<TABLEBORDER> <TR>

<ТН>Січень</ТН> <ТН>Лютий</ТН> <ТН>Березень</ТН> </TR> <TR VALIGN-top>

<ТО>Усі комірки рядка <br> розташовані зверху <br><br><br></TD>

<ТО>Друга<Ьг>комірка</ТО> <ТО>Третя комірка</ГО> </TR> <TR>

<TD VALIGN=top> Розташовано 3Bepxy</TD> <TD VALIGN=bottom>Po3TamoBaHO<br> знизу</ТО>

<TD>3a замовчуванням, <br> розташовано по центру <br><br><br></TD>

</TR> </TABLE>

Заголовок таблиці

Для визначення заголовка таблиці призначається тег <CAPTION>, який слід розташовувати посередині контейнеру <TABLE>...</TABLE>.

Тег <CAPTION> може містити атрибут ALIGN=TOP|BOTTOM, який визначає розташування заголовка відносно таблиці (зверху або знизу таблиці, за замовчуванням - зверху)

ПРИКЛАД

Заголовок зверху

! ! \

Лютий

Березень

;Перша

Друга

!Інша комірка,

їкомірка

комірка

[третя

Фрагмент файла у форматі HTML:

<TABLE BORDER>

<CAPTION ALIGN=top> Заголовок 3Bepxy</CAPTION> <TR>

<ТН>Січень</ТН> <ТН>Лютий</ТН> <ТН>Березень</ТН> </TR> <TR>

<TD>Ilepnia KOMipKa</TD> <ТО>Друга KOMipKa</TD> <TD>lHiua комірка,<Ьг> третя</ГО> </TR> </TABLE>

ПРИКЛАД

Вкладені таблиці

Теги <TD> та <ТН> можуть містити всередині блоковий елемент. Це означає, що мова HTML дозволяє розмічати вкладені

таблиці, тобто припустимою є конструкція <TD> <TABLE>

</TABLE> </TD>-

ПРИКЛАД

Таблиця ABCD знаходиться всередині таблиці 123456

Фрагмент файла у форматі HTML:

<TABLE BORDER>

<CAPTION ALIGN=bottom> Заголовок знизу</САРТІО№> <TR>

<ТН>Січень</ТН>

<ТН>Лютий</ТН>

<ТН>Березень</ТН> </TR> <TR>

<TD>Ilepma комірка</ТВ>

<TD> Друга комірка</ТО>

<TD> Інша комірка,<Ьг> iperH</TD> </TR> </TABLE>

Фрагмент файла у форматі HTML:

<TABLE BORDER>

<TR> <!- Рядок 1, Таблиця 1 -> <TD>K/TD> <TD>2</TD> <TD>3 <TABLE BORDER>

<TR> <!- Рядок І, Таблиця 2 -> <TD>A</TD> <TD>B</TD> </TR>

<TR> <!- Рядок 2, Таблиця 2 -> <TD>C</TD> <TD>D</TD> </TR> </TABLE> </TD> </TR>

<TR> <!- Рядок 2, Таблиця 1 -> <TD>4</TD> <TD>5</TD>

<TD>6</TD> </TR> </TABLE>

Визначення ширини таблиці

Визначення ширини таблиці або окремих її стовпчиків здійснюється за допомогою атрибуту WIDTH=n (n - число або проценти). Атрибут WIDTH може застосовуватись до окремих стовпчиків (визначається в <TD>) або до всієї таблиці (визначається в <TABLE>). Якщо атрибут WIDTH використано в <TABLE>, то він визначає ширину всієї таблиці у вікні броузера (якщо значення визначено у пікселях, то ширина таблиці не залежить від розмірів вікна броузера, якщо значення визначено у відсотках, то таблиця буде займати саме цю частину вікна броузера). Атрибут WIDTH тега <TD> використовується броузером, якщо він не конфліктує з вимогами до ширини сусідніх комірок цього ж стовпчика.

ПРИКЛАД 1

(Таблиця займає 50% ширини екрану, кожний стовпник - 50% ширини таблиці)

ПРИКЛАД 2

(Таблиця займає 50% ширини екрана, ширина стовпчиків не визначається)

Ширина таблиці - 50% ширини екрана    2
З І

Фрагмент файла у форматі HTML:

<TABLE BORDER WIDTH=«50%»>

<TR><TD> Ширина таблиці - 50% ширини екрана</ТО> <TD>2</TD>

</TR>

<TR><TD>3</TD><TD>4</TD>

</TR> </TABLE>

ПРИКЛАД З

(Таблиця займає 100% ширини екрана, ширина стовпчиків не визначається)

Фрагмент файла у форматі HTML:

<TABLE BORDER WIDTH=«50%»>

<TR><TD WIDTH=«50%»>UlHpnHa стовпчика - 50% ширини таблиці</ТО>

<TD WIDTH=«50%»>IllHpHHa стовпчика - 50% ширини таблиці</ТО> </TR>

<TR><TD>3</TD><TD>4</TD> </TR> </TABLE>

Фрагмент файла у форматі HTML:

<TABLE BORDER WIDTH=«100%>»

<TR><TD>UInpnHa стовпчика залежить від обсягу інформації в комірках CTOBn4iiKa</TD><TD>Другий стовпчик таблиці </TD>

</TR> <TR><TD>3</TD><TD>4</TD>

</TR> </TABLE>

Ширина таблиці та вкладені таблиці ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLE BORDER WIDTH=«50%>»

<TR><TD>TeMa K/TD><TD>TeMa 2</TD>

</TR>

<TR><TD>

<TABLE BORDER WIDTH=100%>

<TR><TD>TeMa A</TD><TD>TeMa B</TD> </TR> </TABLE> </TD>

<TD>TeMa 4</TD> </TR> </TABLE>

Центрування таолиці на сторінці

Для центрування таблиці у вікні броузера використовується тег <CENTER>, який необхідно відкрити до початку розмітки таблиці тегом <TABLE> і закрити після </TABLE>

ПРИКЛАД

Фрагмент файла у форматі HTML:

<CENTER>

<TABLE BORDER WIDTH=«50%>» <TR>

<TD>A</TD> <TD>B</TD> <TD>C</TD>

</TR>

<TR>

<TD>D</TD> <TD>E</TD> <TD>F</TD>

</TR> </TABLE> </CENTER>

Висота таблиці та її рядків

Атрибут HEIGHT використовується для визначення висоти таблиці (якщо він є атрибутом тегу <TABLE>) або для визначення висоти рядка відносно висоти таблиці (якщо він є атрибутом тегу <TR>).

ПРИКЛАД

Фрагмент файла у форматі HTML:

<TABLE BORDER WIDTH=«80%» HEIGHT=«80%»>

<TR><TH НЕГСНТ=50%>Розділи довідника</ТО>

<TH WIDTH=«75%»>Ha3Ba розділу</ТО> </TR>

<TR><TD>Poздiл 1.</ТО><ТО>ТРАДИЦІЙНЕ ЖИТ-ЛО</ТБ>

</TR>

<TR><TD>Poздiл 2.</ГО><ТО>НАРОДШ ЗНАННЯ </TD>

</TR>

<TR><TD>Poздiл 3.</TD><TD>yKPAIHCbKA КУХ-НЯ</ТБ>

</TR>

<TR><TD>Poздiл 4.</ТО><ТО>НАРОДНІ ВІРУВАН-НЯ</ГО>

</TR> </TABLE>

Наведений фрагмент розмічає таблицю, яка займає 80% ширини та 80% висоти вікна броузера. Перший її рядок займає 50% висоти таблиці, всі інші рядки розподіляють інші 50% висоти таблиці у Рівних долях. Ширина другого стовпчика таблиці - 75% ширини таблиці.

Відображення файла програмою-броузером:

<FONT SIZE=5><B>Tnnii поселень</В></РОКТ></А> <BRX/TD>

<ТО>Поселення землеробської людності України, які складалися з будівель, пристосованих для життя, різноманітних підсобних занять, утримання свійських тварин та зберігання продуктів, сягають глибини BiKiB.</TD></TR>

<TR>

<TD><IMGSRC=«BUT1_UP.GIF» WIDTH-60 ALT=« »x/TD>

<TD><A HREF=«2.HTM»>

<FONT SIZE=5><B> Типи народного житла</В></РОМТ></А> </TD>

<TD>B основі типології традиційного сільського житлового комплексу також лежить поділ території України на зони, проте він більш розгалужений і детальніший.</TD></TR></TABLE>

</BODY>

</HTML>

Відображення файла програмою-броузером:

Зображення у таблиці

Комірки таблиці можуть містити зображення. Наприклад, графічні маркери можна розташувати в комірках таблиці (приклад взято з Розділу 10. Графіка).

ПРИКЛАД

Файл у форматі HTML:

<HTML> <HEAD>

<ТІТЬЕ>Моя перша НТМЬ-сторінка</ТІТЬЕ> </HEAD> <BODY>

<Н2 ALIGN-CENTER>IIOCEnEHHH, ЖИТЛО, ЗАБУДОВА </Н2>

<HR SIZE=8 WIDTH=40% COLOR=RED>

<TABLEBORDER=1>

<TR>

<TD><IMGSRC=«BUT1_UP.GIF» WIDTH=60 ALT »></TO^

<TD><A HREF=«1.HTM>»

Управління кольором елементів таблиці

Атрибути управління кольором: BORDERCOLOR - колір рам-*и і BGCOLOR - колір фону, використовуються для тегів: ^TABLE>, <TR>, <TH>, <TD>. Відповідно областю їх дії може бути Вся таблиця, рядок або окрема комірка.

Наприклад:

<TABLE BORDER BORDERCOLOR=RED BGCOLOR= YELLOW>...</TABLE> - колір всієї таблиці.

<TR BORDERCOLOR=RED BGCOLOR=YELLOW></TR> -

колір рядка.

<TD BORDERCOLOR=RED BGCOLOR=YELLOW></TD> -

колір комірки.

За допомогою таблиць можна створювати виділені цитати. Цитата вміщується в таблицю між двома горизонтальними лініями. Завдяки атрибуту ALIGN тега <TABLE> текст, який слідує за таблицею, починає її «обтікати». Основний текст розташовується праворуч від таблиці і «обтікає» цитату після того, як перевищить її по висоті. Для виступів тексту від меж сторінки можна застосувати тег <BLOCKQUOTE> (навіть декілька разів). Атрибут BORDER в даному випадку використовувати не слід.

ПРИКЛАД

Файл у форматі HTML:

<HTML>

<BODY>

<Н2 ALIGN=CENTER>ICTOPm КУЛЬТУРИ</Н2>

<TABLE ALIGN=LEFT>

<TR>

<TD ALIGN=CENTER>

<HR>

<В>...Той, хто не знає свого минулого,<BR> не вартий майбутнього...<ВІІ> М.Рильський </B><HR></TD>

</TR>

</TABLE>

<BLOCKQUOTE><BLOCKQUOTE><BLOCKQUOTE>

<P ALIGN=JUSTIFY> Звертання до традицій зовсім не означає нехтування сьогоденням. Тільки осмисливши минуле, пізнавши витоки своєї культури та історії, можна чіткіше зрозуміти сьогодення і уявити майбутнє. Традиційна етнокультурна інформація може зберігатися тільки передаючись від  батьків до дітей та онуків

</BLOCKQUOTE></BLOCKQUOTE></BLOCKQUOTE>

</BODY>

</HTML>

Відображення файла програмою-броузером:


 

А также другие работы, которые могут Вас заинтересовать

83763. Функции налога 45.43 KB
  Сущность налогов как экономикоправовой категории их роль и общественное назначение могут быть раскрыты на основе их функций. Функции налогов выражают наиболее существенные главные черты правовых механизмов налогообложения и направлены на достижение конкретных задач стоящих перед НП. Существующие подходы к проблеме налоговых функций можно условно разделить на три группы: только фискальная функция; фискальная и регулирующая присущие высокоразвитым рыночным отношениям; многофункциональное проявление сущности налогов кроме фискальной и...
83764. Виды налогов и основания их классификации 46.97 KB
  В настоящее время система налогов и сборов Российской Федерации довольно обширна и в некоторой степени громоздка. Вместе с тем каждый налог индивидуален поскольку предполагает собственную правовую конструкцию и занимает строго определенное место не только в системе налогов и сборов но и в финансовой системе в целом. Выяснение местоположения каждого налога в финансовой системе координат способствует точному установлению механизма его введения определению уровня бюджета в который зачисляется каждый налог круга плательщиков и перечня...
83765. Налоговая система. Основы законодательства о налогах и сборах. Принципы налогообложения 48.43 KB
  Понятие НС сегодня следует отнести к дискуссионным вопросам и актуальному предмету исследования в сфере налогов.2: НС это совокупность налогов сборов пошлин и других платежей взимаемых в установленном порядке.: НС это совокупность установленных в государстве существенных условий налогообложения установленных НП и налоговым законодательством. 3 НК порядок установления и введения налогов часть 1 НК система налогов совокупность отдельных налогов обладающая организационноправовым и экономическим единством.
83766. Элементы юридического состава налога. Основные и факультативные. Понятие и их правовое значение 43.59 KB
  Обязанность плательщика по уплате налога устанавливается совокупностью элементов юридического состава налога. Элементы налога это внутренние исходные функциональные единицы которые в своей совокупности составляют юридическую конструкцию налога и придают им их универсальность. Обязательные существенные элементы юридического состава налога это элементы без которых налоговое обязательство и порядок его исполнения не могут считаться определенными.
83767. Субъект налогообложения: понятие субъектов, виды, правовой статус 47.87 KB
  Общественные отношения преимущественно образующие предмет налогового права складываются относительно перехода права собственности на денежные средства. Большинство названных отношений направлены на достижение баланса частных и публичных интересов поэтому и понятие субъекта налогового права носителя интереса является ключевым. Точное определение субъекта налогового права имеет и практическое значение поскольку позволяет выявить круг лиц вступающих в налоговые отношения и действия которых влекут юридически значимые последствия. Наличие...
83768. Объект и предмет налогообложения. Масштаб налога и налоговая база 44.73 KB
  Объект налогообложения это те юридические факты действия события состояния которые обуславливают обязанность субъекта заплатить налог совершение оборота по реализации товара работ услуг; ввоз товара на территорию России; владение имуществом; совершение сделки куплипродажи ценных бумаг; вступление в наследство; получение дохода и т. наличие объекта налогообложения. Налоговый кодекс Российской Федерации определяет понятие объект налогообложения так: Объектами налогообложения могут являться операции по реализации товаров работ...
83769. Налоговый период, порядок исчисления налога, способы, сроки и порядок уплаты налога 42.93 KB
  Налоговый период календарный год или иной период времени применительно к отдельным налогам по окончании которого определяется налоговая база и исчисляется сумма налога подлежащая уплате. Продолжительность момент начала и момент окончания каждого налогового периода устанавливается законодательством о налогах и сборах применительно к каждому отдельному налогу. Порядок исчисления налога ст.
83770. Понятие системы налогов и сборов. Структура и принципы построения 45.33 KB
  Система налогов и сборов не путать с налоговой системой это совокупность налогов и сборов взимаемых с плательщиков в порядке и на условиях определенных Налоговым кодексом. 12 НК РФ устанавливает следующие виды налогов и сборов в РФ: федеральные; региональные; местные. Федеральные налоги Федеральными налогами и сборами признаются налоги и сборы которые установлены НК РФ и обязательны к уплате на всей территории РФ при отсутствии специальных налоговых режимов п.
83771. Налоговое право РФ: общие положения, предмет, метод, система 46.7 KB
  Сегодня основными научными подходами для определения места НП в системе юридических наук являются: 1 концепция рассмотрения НП в качестве обособленной части АП швейцарская налоговая правовая доктрина 2 концепция рассмотрения НП в качестве обособленной части ФП неаполитанская налоговая правовая школа 3 концепция автономии НП согласно которой оно занимает особое или даже исключительное положение в системе права независимое от общих принципов как частного так и публичного права французская налоговая правовая доктрина 4 концепция...