Новини освіти і науки:

G+

Тлумачний словник
Авто
Автоматизація
Архітектура
Астрономія
Аудит
Біологія
Будівництво
Бухгалтерія
Винахідництво
Виробництво
Військова справа
Генетика
Географія
Геологія
Господарство
Держава
Дім
Екологія
Економетрика
Економіка
Електроніка
Журналістика та ЗМІ
Зв'язок
Іноземні мови
Інформатика
Історія
Комп'ютери
Креслення
Кулінарія
Культура
Лексикологія
Література
Логіка
Маркетинг
Математика
Машинобудування
Медицина
Менеджмент
Метали і Зварювання
Механіка
Мистецтво
Музика
Населення
Освіта
Охорона безпеки життя
Охорона Праці
Педагогіка
Політика
Право
Програмування
Промисловість
Психологія
Радіо
Регилия
Соціологія
Спорт
Стандартизація
Технології
Торгівля
Туризм
Фізика
Фізіологія
Філософія
Фінанси
Хімія
Юриспунденкция

Таблиці

Важливим інструментом Web-дизайну є таблиці, які використовуються не лише для виведення табличних даних, але і для управління взаємним розміщенням тексту й графіки, створення колонок газетного типу, кольорових ефектів та ін. Таблиця задається тегом <TABLE>…</TABLE>, що має цілий ряд опцій:

Таблиця 2

Опція	Призначення
ALIGN="вирівнювання"	Вирівнювання усієї таблиці відносно тексту, в якому вона знаходиться (left, center або right)
BORDER="число"	Ширина бордюру таблиці, у пікселях
CELLSPACING="число"	Відстань між комірками, у пікселях
CELLPADDING="число"	Розмір вільного простору між границями комірки та її вмістом, у пікселях
HSPACE="число"	Розмір вільного простору зліва та справа від таблиці, у пікселях
VSPACE="число"	Розмір вільного простору зверху і знизу від таблиці, у пікселях
WIDTH="ширина"	Ширина таблиці у пікселях або відсотках від ширини вікна броузера
BACKGROUND="IMAGES\ptichka.jpg"	Заповнює комірку фоновим малюнком. Необхідно вказати URL малюнка
BGCOLOR="CCFFFF"	Визначає колір фону комірки
COLSPAN	Визначає кількість стовпців, які об¢єднуються. За замовчуванням має значення 1
ROWSPAN	Визначає кількість рядків, які об¢єднуються. За замовчуванням має значення 1
VALIGN	Визначає спосіб вертикального вирівнювання змісту комірки. Можливі значення: top, bottom, middle. За замовчуванням – рівняння по центру (VALIGN="middle)

Таблицю визначають таким чином:

<table>

<tr>

<td>Вміст комірки</td>

...

</tr>

<tr>

<td>Вміст комірки</td>

...

</tr>

...

</table>

Тег <TR>…</TR> визначає рядок таблиці, а тег <TD>…</TD> — комірку в рядку. Якщо комірку треба залишити пустою, то в неї розміщують символ пропуску &nbsp;

Завдання 1. Створити таблицю.

<HTML>

<HEAD>

<TITLE> Розклад занять навчальних груп

</TITLE>

</HEAD>

<B> Навчальна група

</B></FONT><BR></P>

<B> Понеділок </B></FONT><BR>

<table width="100%" border="1" cellspacing="0" cellpadding="0" bordercolorlight="#009966" bordercolordark="#9999FF">

<tr bgcolor="#9999FF">

<td> Заняття </td>

<td> 1 група </td>

<td> 2 група </td>

<td> 3 група </td>

</tr>

<tr bgcolor="#33CCCC">

<td> 1</td>

<td> Інформатика </td>

<td> Історія </td>

<td> Математика </td>

</tr>

<tr bgcolor="#33CCCC">

<td> 2</td>

<td> Російська мова </td>

<td> Література </td>

<td> Англійська мова </td>

</tr>

<tr bgcolor="#33CCCC">

<td> 3</td>

<td> Математика </td>

<td> Історія </td>

</tr>

</table>

</BODY>

</HTML>

У цьому прикладі границя таблиці виконана у двох кольорах. Це досягається за рахунок використання атрибутів BORDERCOLORLIGHT та BORDERCOLORDARK.

Завдання 2. Створити “неправильну” таблицю.

	Характеристики
Середній зріст, см	Середня вага, кг
Стать	Чоловіча
Жіноча

......................................................................................

<tr>

<td colspan="2">Характеристики</td>

</tr>

<tr>

<td> Середній зріст, см </td>

<td> Середня вага, кг </td>

</tr>

<td> Чоловіча </td>

</tr>

<td> Жіноча </td>

</tr>

</table>

........................................................................

Не знайшли потрібну інформацію? Скористайтесь пошуком google:

Генерація сторінки за: 0.007 сек.