- •Практична робота № 7 мова гіпертекстової розмітки – html Загальні відомості
- •Види тегів в html
- •Основні теги мови html
- •Основні кольори
- •Завдання № 7 Тема: Підготовка найпростішого гіпертекстового документа засобами програми Блокнот
- •Частина 1. Основні теги оформлення тексту документа й малюнків.
- •Неистовой судьбы - иль против моря
- •Частина 2. Робота з таблицями, створення гіперпосилань
- •Контролі питання
Основні теги мови html
Призначення |
Вид тегів |
Примітки |
||||||
Загальна структура документа HTML |
||||||||
Тип документа |
<HTML></HTML> |
Початок і кінець. |
||||||
Ім’я документа |
<HEAD></HEAD> |
Не відображається Браузером. |
||||||
Заголовок |
<TITLE></TITLE> |
Відображається в рядку заголовка вікна Браузера. |
||||||
Тіло |
<BODY></BODY> |
|
||||||
Коментарій |
<! --***--> |
Ігнорується оглядачем. |
||||||
Структура змісту документа |
||||||||
Внутрішні заголовки різного рівня |
<HN></HN> |
Де N – номер рівня заголовка (від 1 до 6–ти). |
||||||
Заголовок з вирівнюванням |
<H? ALIGN=”left”></H?> |
Типи вирівнювання:
|
||||||
Форматування абзаців |
||||||||
Створення абзацу (параграфа) |
<P></P> |
|
||||||
Перехід рядка всередині абзацу |
<BR> |
Одиничний тег |
||||||
Перенос |
<WBR> |
|
||||||
Вирівнювання абзацу |
<P ALIGN=”left”></P> |
Типи вирівнювання: left, right, center і - justify |
||||||
Горизонтальна лінія між абзацами |
<HR> |
Одиничний тег |
||||||
Атрибути: товщина, довжина лінії, вирівнювання |
<HR SIZE=? WIDTH=? ALIGN=”left”> |
Товщина вказується в пікселях, довжина – в пікселях або %, вирівнювання за замовчуванням center |
||||||
Форматування шрифту |
||||||||
Логічне форматування |
|
|||||||
Виділення тексту курсивом - Напівжирним - Як з клавіатури - |
<EM></EM> <STRONG> </STRONG> <KBD> </KBD> |
Фрагмент документа: Обычный текст <EM>Курсив </EM> <KBD>Моноширинный</KBD> |
||||||
Фізичне форматування |
<B> жирный</B> <S> подчеркнутый</S> X<SUP>2</SUP> - отобразится как X2 <I> курсив </I> |
|||||||
Курсив |
<I> </I> |
|||||||
Підкреслений |
<U> </U> |
|||||||
Перекреслений |
<S> </S> |
|||||||
Моноширінний |
<TT> </TT> |
|||||||
Верхній індекс |
<SUP></SUP> |
|||||||
Нижній індекс |
<SUB></SUB> |
|||||||
Розмір шрифту |
<FONT SIZE=?></FONT> |
Від 1 до 7 |
||||||
Базовий розмір шрифту (задається для всього документа вцілому) |
<BASEFONT SIZE=?> |
Від 1 до 7, за замовчуванням рівний 3 |
||||||
Список кращих гарнітур шрифтів, через кому |
<FONT FACE=”шр-т1,шр-т2”> |
<FONT FACE="Verdana,Arial"> |
||||||
Колір шрифту (задається або ключовим словом, або шістнадцятирічним кодом) |
<FONT COLOR=”$$$$$$”> </FONT> |
Red –червоний Blue – блакитний #ff0000 – 16-тирічний код червоного кольору в форматі RGB |
||||||
Створення списків |
||||||||
Впорядкований |
<OL></OL> |
Фрагмент документа: <OL> <LI>Элемент списка 1</LI> <LI>Элемент списка 2</LI> <LI>Элемент списка 3</LI> </OL>
|
||||||
Невпорядкований |
<UL></UL> |
|||||||
Елемент списку |
<LI></LI> |
|||||||
Списки визначень |
<DL></DL> |
|||||||
Визначені терміни |
<DT></DT> |
|||||||
Визначення |
<DD></DD> |
|||||||
Таблиця |
||||||||
Визначити таблицю |
<TABLE></TABLE> |
<TABLE border=”1”> <TR> <TH>Товар</TH> <TH>Цена</TH> </TR> <TR> <TD>Радиотелефон </TD> <TD align=”center”> 2000 </TD> </TR> </TABLE> |
||||||
Окантовка таблиці |
<TABLE BORDER=?></TABLE> |
|||||||
Рядок таблиці |
<TR></TR> |
|||||||
Вирівнювання |
<TR ALIGN=LEFT | RIGHT | CENTER | JUSTIFY > |
|||||||
Комірки таблиці |
<TD></TD> |
|||||||
Вирівнювання по горизонталі |
<TD ALIGN=LEFT | RIGHT | CENTER | JUSTIFY> |
|||||||
Ширина (в пікселях або у % до ширини вікна) |
<TD WIDTH=?> |
|||||||
Заголовок стовбців або рядків (напівжирний) |
<TH></TH> |
|||||||
Вставка зображень |
||||||||
Вставка графічного файла |
<IMG SRC=”URL” WIDHT=”?” HEIGHT=”?”> |
Фрагмент документа: <IMG SRC=”grafica.gif” WIDHT=”550” HEIGHT=”240” ALT=”Графический файл”> |
||||||
Вирівнювання тексту |
<IMG SRC=”URL” ALIGN=”TOP”> |
|||||||
Вивід альтернативного тексту |
<IMG SRC=”URL” ALT=”текст*”> |
|||||||
Вставка посилань |
||||||||
Посилання на іншу сторінку |
<A HREF=”URL”> текст </A> |
Фрагмент документа: <A HREF=”str2.htm”> Ссылка1</A> <A HREF=”URL”>текст</A> <A NAME=”metka1”></A> <A HREF=”index.htm#metka1”> На главную страницу</A>” |
||||||
Посилання на вкладку в іншому документі |
<A HREF=”URL#*”> текст</A> |
|||||||
На вкладку в тому ж документі |
<A HREF=”#*”> текст</A> |
|||||||
Визначити вкладку |
<A NAME=”*”></A> |
|||||||
Колір фону, тексту і посилань |
||||||||
Фоновий малюнок |
<BODY BACKGROUND=”URL”> |
Фрагмент текста: <BODY BACKGROUND=”grafica.gif” TEXT=”black” (чорний) LINK=”#FF0000” (червоний) VLINK=”#FFFF00” (жовтий) ALINK=”#FFFFFF”> (білий) ------------------------- </BODY> |
||||||
Колір фону |
<BODY BGCOLOR=”#$$$$$$”> |
|||||||
Колір тексту |
<BODY TEXT=”#$$$$$$”> |
|||||||
Колір посилання |
<BODY LINK=”#$$$$$$”> |
|||||||
Колір пройденого посилання |
<BODY VLINK=”#$$$$$$”> |
|||||||
Колір активно посилання |
<BODY ALINK=”#$$$$$$”> |
|||||||
Додаток 7.2