горизонтальна лінійка шириною в 10 пікселів, що займає половину ширини вікна і розташовану справа, слід записати:
<HR ALIGN=RIGT SIZE="10" WIDTH="50%">.
Для створення горизонтальної лінійки зеленого кольору шириною в 8 пікселів, що займає 80 % ширина вікна при вирівнюванні по центру, слід записати:
<HR ALIGN=CENTER SIZE="8" WIDTH="80 %" COLOR="GREEN">.
Відповідно для завдання смуги червоного кольору слід записати COLOR= "RED", для завдання блакитного кольору лінії слід записати COLOR= "BLUE" і т.д.
1.1.3. Списки
Для представлення інформації у вигляді ненумерованого списку використовуються теги <UL> і </UL>. Кожен елемент списку задається за допомогою непарного тегу <LI>.
<UL>
<LI> Приклад I
<LI> Приклад 2
<LI> Приклад 3
</UL>
Для представлення інформації у вигляді нумерованого списку використовуються теги <OL> і </OL>. Кожен елемент списку задається за допомогою непарного тегу <LI>.
Приклад:
<OL>
<LI> Приклад 1
<LI> Приклад 2
<LI> Приклад 3
</OL>
1.1.4. Таблиці
Таблиці зручні для представлення великих об'ємів даних. Таблиця в мові HTML задається за допомогою парного тегу <TABLE>. Вона може містити заголовок, що задається парним прапором <CAPTION>, і рядки таблиці, які задаються за допомогою парних тегів <TR>. Закриваючий тег </TR> можна опустити. Кожен рядок таблиці містить осередки таблиці, які можуть відноситися до двох різних типів. Осередки в заголовках стовпців рядків задають парним тегом <ТН>, інші осередки парним прапором <TD>. Закриваючі прапори </ТН> і </TD> можна опустити. Атрибути елементів, використовуваних при створенні таблиць:
a) ALIGN. Елемент – таблиця, заголовок, рядок, осередок.
Використовуються для вирівнювання таблиці по горизонталі, розміщення заголовка над або під таблицею;
WIDTH. Елемент – рядок, осередок. Задається ширина;
HIGHT. Елемент – осередок. Задається висота;
BGCOLOR. Елементи – таблиця, осередок. Задає колір фону;
e) BORDER. Елемент – таблиця. Відображення меж осередків і зовнішньої рамки таблиці.
1.1.5. Коментарі
Коментарі розміщуються між тегами <DL> і </DL>. Терміни всередині коментаря починаються з тегу <DT>, визначення починаються з тегу <DD>.
Приклад,
<DL>
<DT> Байт <DD> Містить 8 бітів.
<DT> Кілобайт <DD> Містить 1024 байти.
</DL>
1.2. Форматування тексту
Управління форматуванням тексту не є основним завданням мови HTML. Тому у сучасних версіях HTML, починаючи з версії 4.0 теги, що задають форматування, розглядаються як застарілі. Їх використання не рекомендується.
Парний тег <Font> управляє параметрами шрифту. Він повинен містити хоч би один з трьох атрибутів: Color, Face, Size. Атрибут Color задає колір тексту. Наприклад, Color= «Red». Атрибут Size визначає розмір шрифту у відносних одиницях від 1 до 7. Наприклад, Size=4. Цей атрибут можна задавати із знаком + або – щодо поточного розміру. Наприклад, <Font Size=+2>. Атрибут Face задає гарнітуру шрифту.
Приклад, <FONT SIZE=4> Шрифт 4-го розміру </FONT>
<FONT COLOR=«GREEN»> Цей текст зелений </FONT>
Зображення символів задається за допомогою парних тегів: <В> (напівжирний шрифт), <І> (курсив), <U> (підкреслений текст), <S> (викреслений текст). Їх використання не рекомендується. Замість них слід використовувати парні прапори <ЕМ> (виділення), <STRONG> (сильне виділення). Для опису комп'ютерних програм використовують парні прапори <CODE> (початковий текст програми), <KBD> (текст, що вводиться з клавіатури), <SAMP> (приклад введення програми), <VAR> (програмні змінні).
1.2.1 Гіперпосилання
HTML-документ є гіпертекстовим. Тег гіперпосилання є одним з найбільш важливих тегів мови HTML. Цей тег позначає текст або графічне зображення як мету переміщення в Інтернеті. Гіперпосилання визначається парним тегом <А> і </А>. Тег <А> включає декілька атрибутів. Обов'язково є наявність одного з наступних атрибутів: Name або HREF. Як значення атрибуту використовується URL-адреса документа, на який веде посилання. Ним може бути довільний документ, розташований на загальнодоступному вузлі мережі (Web-вузол, архів FTP і ін.). Наприклад, щоб потрапити на сайт Галицької Академії, слід записати гіперпосилання <А HREF= >.
Для створення гіперпосилання, наприклад, в документі Zavdana на документ з іменем Zavdana1, в текст цього документу слід вставити рядок
<А HREF=«Zavdana1.htm»> Zavdana1 </A>.
1.2.2 Підготовка і використання графічних файлів
Графічні ілюстрації є в більшості випадків невід'ємною частиною Web-документа. Для використання графічних файлів використовуються два формати – GIF і JPEG.
У Web-документі можна виділити наступні типи графічної інформації:
картинки для шпалер документів;
кнопки і заголовки;
картинки або безпосередньо графічні матеріали.
Малюнки зберігаються на Web-вузлах в окремих файлах, але відображаються як елементи Web-сторінок. Для вставки малюнка використовується текстовою елемент, що задається непарним тегом <IMG>. Він повинен містити обов'язковий атрибут SRC, що задає адресу файлу із зображенням у відносній або абсолютній формі.
Наприклад: <IMG SRC= «Ris1.gif»>.
При відображенні малюнка браузер за умовчанням використовує його реальні розміри. Атрибути WIDTH і HIGHT задають ширину і висоту малюнка в пікселях.
Наприклад:
<IMG SRC=«Ris2.jpg» WIDTH=«50» HEIGHT=«40»>.
Для завдання способу взаємодії малюнка з текстом використовується атрибут ALIGN, який може приймати значення:
BOTTOM – нижня межа зображення поєднується з нижнім краєм текстового рядка;
MIDDLE – середина зображення поєднується з серединою текстового рядка;
ТОР – верхня межа зображення вирівнюється по верхньому краю текстового рядка;
LEFT – зображення розміщується у лівого краю сторінки;
RIGHT – зображення розміщується у правого краю сторінки, а текст розміщується зліва від нього.
Наприклад:
<IMG SRC = «Ris3.gif» ALIGN = ВОТТОМ>
Фоновий малюнок (шпалери) задається за допомогою атрибуту BACKGROUND в тегу <BODY>. Значенням цього атрибуту повинна бути абсолютна або відносна адреса URL для файлу із зображенням. Наприклад:
<BODY BACKGROUND = «waves.gif» TEXT = «YELLOW»>.
Картинки, які можна використовувати як фон, можна знайти, наприклад, на Web-сервері .
Розглянемо використання малюнків з картинної галереї ClipArt. Для створення файлу з малюнком з цієї колекції використаємо програма WORD. З допомогою меню Вставка>Малюнок>Картинки вставити в документ неохідний