- •Html-формат
- •Робота з тегами.
- •Як працюють браузери
- •Визначення html-файлу.
- •Визначення заголовка.
- •Завдання розміру символів
- •Використання стилів заголовка
- •Гарнітура і колір шрифту.
- •Запис кольору у форматі rgb
- •Атрибути зображення
- •Посилання в межах одного документа
- •Як підготувати гарну Web-сторінку
- •Тестування
- •Висновок
Атрибути зображення
Атрибут |
Формат |
Опис |
ALT |
<IMG SRC="WAGON.GIF" ALT=" картинка"> |
Задає текст, що заміняє зображення в тому випадку, якщо броузер не сприймає це зображення |
BORDER |
<IMG SRC="WAGON.GIF" BORDER="3"> |
Задає товщину рамки навколо зображення. Виміряється в пік селях |
ALIGN |
<IMG SRC="WAGON.GIF" ALIGN=TOP> |
Задає вирівнювання зображення щодо тексту: щодо тексту вирівняна верхня частина зображення - ТОР, нижня - BOTTOM. середня – MIDDLE |
HEIGHT |
<IMG SRC="WAGON.GIF" HEIGHT=111> |
Задає вертикальний розмір зображення усередині вікна браузера |
WIDTH |
<IMG SRC="WAGON.GIF" WIDTH=220 > |
Задає горизонтальний розмір зображення усередині вікна браузера |
VSPACE |
<IMG SRC="WAGON.GIF" VSPACE="8"> |
Задає додавання верхніх і нижнього порожніх полів |
HSPACE |
<IMG SRC="WAGON.GIF" HSPACE="8"> |
Задає додавання лівих і правого порожніх полів |
Завдання 11. Установка атрибутів зображення.
Самостійно внесіть зміни у файл RASP.HTM: випробуйте використання таких атрибутів графіки, як ALT, BORDER, HEIGHT, WIDTH.
Примітка. Завжди звертайте увагу на розмір (обсяг у байтах) графічного файлу, тому що це впливає на час завантаження Web-сторінки.
Завдання 12. Установка фонового зображення на Web-сторінці.
Фонове зображення — це графічний файл із зображенням невеликої прямокутної плашки. При перегляді в браузері ця плашка багаторазово повторюється, заповнюючи усе вікно, незалежно від його розмірів.
Графіка, використовувана в якості фонової, задається в тегі <BODY>.
Внесіть зміни у файл RASP.HTM:
<HTML>
<HEAD>
<TITLE>Навчальний файл HTML</TITLE>
</HEAD>
<BODY BACKGROUND="fon1.GIF" TEXT="#330066">
<P ALIGN=CENTER>
<FONT COLOR="#008080"SIZE="7"><B>
Розклад</B></FONT><BR>
<FONT SIZE="6"> <I>занять на вівторок</I>
</FONT>
</Р>
</BODY>
</HTML>
Таблиці
Таблиця є особливою частиною HTML-документа. Вона являє собою прямокутну сітку, що складається з вертикальних стовпців і горизонтальних рядків. Перетинання рядка і стовпця називається осередком. Осередок може містити в собі текст, графіку або іншу таблицю.
Таблиця складається з трьох основних частин:
• назви таблиці;
• заголовків стовпців;
• осередків.
Таблиця заповнюється по рядках (ліворуч праворуч — по рядку, потім перехід на наступний рядок). Кожен осередок повинний бути заповнений. Для створення порожніх осередків використовуються пробіли.
Теги оформлення таблиць і їхніх атрибутів описані в таблицях 3 — 5.
Завдання 13.Створення таблиці.
1. Запустіть програму Блокнот.
2.Наберіть наступний текст у вікні редактора:
<HTML>
<HEAD>
<TITLE>Розклад занять 5 класів
</TITLE>
</HEAD>
<BODY BGCOLOR="FFFFFF">
<P ALIGN=CENTER>
<FONT COLOR="RED" SIZE="6" FACE="ARIAL">
<B> 5 клас
</B></FONT><BR></P>
<FONT COLOR="BLUE"SIZE="4" FACE="COURIER">
<B>Понеділок </B></FONT><BR>
<TABLE BORDER="1" WIDTH=100%
BGCOLOR="99CCCC">
<TR BGCOLOR="CCCCFF" ALIGN=CENTER>
<TD>Урок</TD> <TD>5 A</TD> <TD>5 Б</TD>
<TD>5 B</TD>
</TR>
<TR>
<TD>1</TD> <TD>Російський мова</ТD>
<ТD>Література</ТD><ТD>Історія</ТD>
</TR>
<TR>
<TD>2</TD> <TD>Алгебра</TD>
<ТD>Інформатика</ТD> <ТD>Англ.мова</ТD>
</TR>
<TR>
<TD>3</TD> <ТD>Історія</ТD> <ТD>Інформатика</ТD>
<TD> Алгебра</TD>
</TR>
</TABLE>
</BODY>
</HTML>
3. Збережіть файл під ім'ям 5.НТМ.
4. Для перегляду створеної Web-сторінки завантажте браузер Microsoft Internet Explorer.
Завдання 14. Побудова гіпертекстових зв'язків
Найважливішою властивістю мови HTML є можливість включення в документ посилань на інші документи.
Можливі посилання:
- на інший HTML-файл,
- на деяку мітку в поточному HTML-документі,
- на будь-який файл, що не є HTML-документом.
Як посилання можна використовувати текст або графіку.