- •Проектування власного web-сайту
- •Введення в html
- •Створення web-сторінки
- •Оголошення та ідентифікація документа
- •Вставка символів прогалин ( )
- •Вставляння спеціальних символів
- •Створення надстрічкових та підстрічкових індексів
- •Вибір шрифту
- •Зміна розміру шрифту
- •Вибір кольору шрифту
- •Використання моноширінних шрифтів
- •Створення маркованих списків
- •Створення багаторівневих списків
- •Створення списків визначень
- •Вирівнювання тексту відносно графіки
- •Пуста область навколо графічного зображення
- •Побудова горизонтальної лінійки
- •Побудова списків з графічними маркерами
- •Побудова гіперпосилання, що вказує на іншу Web-сторінку
- •Створення посилання на об’єкт цієї ж сторінки
- •Створення гіперпосилання, що вказує на зображення
- •Створення гіперпосилання, що вказує на файл
- •Посилання на адресу електронної пошти
- •Колір тексту гіперпосилань
- •Створення таблиці
- •Товари та ціни
- •Товари та ціни
- •Групування стовпчиків таблиці
- •Товари та ціни
- •Зміна розмірів комірки таблиці
- •Об’єднання комірок таблиці
- •Вирівнювання даних у комірці таблиці
- •Перенесення слів всередині комірок таблиці
- •Задавання параметра обтіканні таблиці текстом
- •Створення фреймів
- •Відтворення об’єкту гіперпосилання у вікні фрейму
- •Смуги прокрутки фреймів
- •Використання атрибуту noresize
- •Властивості меж фреймів
- •Задавання величини полів фрейму
Колір тексту гіперпосилань
Атрибути LINK, VLINK I ALINK дозволяють задати колір шрифту для тексту гіперпосилань.
Атрибут LINK служить для виділення кольором гіперпосилань, які ще не вибирались читачами, а VLINK – для відображення посилань, до яких він уже звертався. Атрибут АLINK дозволяє відмітити активне гіперпосилання – ту, яка вибрана у даний момент.
Використовуючи атрибути зміни кольору, потрібно зважати,що гіперпосилання цих трьох категорій у вікні браузера повинні виглядати по-різному.
Наприклад,
<BODY LINK=”red” VLINK =”#0000FF”>
Web-браузер при цьому відтворить текст гіперпосилань тими кольорами, які були задані.
Побудова таблиць
Створення таблиці
Таблиця – зручний засіб подання даних, яким притаманна чітко виражена внутрішня структура, - наприклад, фінансових звітів, списків товарів.
Мова HTML пропонує декілька спеціальних дескрипторів для створення таблиць Дескриптори <TABLE> і </TABLE> обмежують текст опису майбутньої таблиці, тег <TR> використовується для визначення її стрічок, а <TH> і <TD> дозволяють створювати комірки таблиці.
Існує два типи комірок, з яких може бути побудована таблиця. Дескриптор <TH> відповідає за створення комірок з заголовками, а тег <TD> дає можливість визначення комірок для зберігання даних таблиці. Комірки з заголовками зазвичай містять текстовий опис даних конкретної стрічки або стовпчика таблиці, а комірки даних зберігають у собі основну інформацію. Вміст комірок заголовків відображається напівжирним шрифтом і вирівнюється по центру.
Для того, щоб створити таблицю потібно:
ввести дані, які повинні відображатись у першій стрічці таблиці;
використовуйте символи табуляції для візуального виділення даних кожної комірки;
ввести дані, які потрібно помістити у другу стрічку таблиці;
повторити операцію для всіх решти стрічок таблиці;
ввести <TABLE> безпосередньо перед текстом, що визначає вміст таблиці;
набрати </TABLE> після завершення тексту таблиці;
ввести <TR> перед фрагментами тексту, що являють собою дані кожної стрічки таблиці;
набрати </TR> по закінченні фрагментів тексту кожної стрічки таблиці;
ввести <TH> перед текстом кожної комірки заголовка;
завершити текст кожної комірки заголовка тегом </TH>;
ввести <TD> перед текстом кожної комірки даних;
завершити текст кожної комірки даних тегом </TD>.
Наприклад,
<H1> <CENTER>Товари та ціни</CENTER></H1>
<TABLE>
<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>
<TR>
<TD>Лінійки</TD>
<TD>2 грн. <T/D>
<TD>150</TD>
</TR>
</TABLE>
відобразиться браузером:
Товари та ціни
Назва товару |
Ціна 1 шт. |
Кількість на складі |
Олівці |
1 грн. |
100 |
Ручки |
5 грн. |
200 |
Лінійки |
2 грн. |
150 |
Обрамлення таблиці
Атрибут 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>
відобразиться браузером: