заголовка чи іншого елемента на сторінці потрібно задати явно, то використовують теги вирівнювання:
<CENTER> елемент </CENTER> – вирівнювання до центру;
<LEFT> елемент </LEFT> – вирівнювання до лівого краю;
<RIGHT> елемент </RIGHT> – вирівнювання до правого краю.
Інформацію можна подати у вигляді таблиці без рамок за допомогою парного тега <PRE>...</PRE>. Текст в середині цього тега оформляють засобами табуляції. Броузер такий текст переформатовувати не буде. Теги для створення таблиць з рамками тут не розглядатимемо.
5. Тег задання параметрів шрифта FONT. Щоб задати назву конкретного шрифта, його розмір і колір використовують парний тег FONT з параметрами FACE, SIZE та COLOR, наприклад:
<FONT FACE = "Decor, Arbat, Kudriashov" SIZE = +2 COLOR = "red"> текст </FONT>
Якщо на комп'ютері клієнта встановлено шрифт Decor, то він буде застосований до даного тексту, інакше броузер застосує шрифт Arbat чи Kudriashov, інакше – деякий свій стандартний шрифт, наприклад, Times New Roman. Розміри символів шрифта можуть бути від 1 до 7. Розмір 3 вважається стандартним, він орієнтовно: відповідає 10 пікселам. Розмір 7 є найбільшим. Число 2 як значення параметра SIZE означає другий розмір шрифта, число +2 означає, що розмір шрифта має бути на дві одиниці більший, ніж стандартний, тобто п'ятий, число -2 означатиме перший розмір шрифта – на дві одиниці менший, ніж стандартний. Колір тексту буде червоний. Основні кольори мають такі назви:
black – чорний green – зелений
navy – темносиній teal – бірюзовий
silver – сірий lime – яскраво-зелений
blue –синій aqua – блакитний
maroon – малиновий olive – темно-зелений
purple – бузковий gray – темно-сірий
red – червоний yellow – жовтий
fushsia – рожевий white – білий
Завдання 1. Створіть свою особисту Web-сторінку. Викличіть Notepad чи деякий Web-редактор. Введіть текст про себе за на-веденим нижче зразком і збережіть його у файлі filel.htm:
<HTML>
<HEAD>
<TITLE> My Web-page </TITLE>
</HEAD>
<BODY BGCOLOR = "aqua" TEXT = "red">
<H2> Це Web-сторінка Валентини Мосійчук</Н2> <HR>
<CENTER> <В>Привіт!</В> Мене звати <В>Валентина</В>
</CENTER><P>
Я вчуся на ___ курсі на факультеті _______Івано-Франківського національного технічного університету <I>" нафти і газу "<I>. Мені __ рік. Мої улюблені дисципліни:______. Я люблю ..... <BR>
<CENTER>Kолись тут буде моя фотографія.</CENTER><P>
<ADDRESS>Mоя адреса: 76000, Івано-Франківськ, головпоштамт, п.с. 580 </ADDRESS><HR>
</BODY> </HTML>
Збережіть файл на диску і перегляньте його за допомогою броузера, клацнувши на його піктограмі. Поекспериментуйте з тегами форматування тексту і розмірами вікна, в якому демонструється документ. Переконайтеся, що броузер автоматично міняє розташування тексту, щоб його можна було переглядати без горизонтальної смуги прокручування (текстові редактори такого ефекту не дають).
Створення списків. Є три типи списків: ненумерований, нумерований, означення. Список може мати заголовок, яким охоплюють тегами <LH>...</LH>, наприклад, <LН> Це заголовок списку <LН>.
Ненумерований список утворюють за допомогою парного тега <UL> ...</UL> і одинарних тегів <LI>, наприклад, так:
<LH> Мої улюблені предмети:</LH>
<UL>
<LI>інформатика
<LI>математика
<LI>англійська мова
<LI>історія
</UL>
На екрані отримаємо:
Мої улюблені предмети:
інформатика
математика
англійська мова
історія
Нумерований список створюють за допомогою парного тега <OL>...</OL> з необов'язковим параметром TYPE і одинарних тегів <LI>, наприклад, так:
<LH> Мої улюблені предмети:</LH>
<OL TYPE="1">
<LI>Інформатика
<LI>Англійська мова
<LI>Історія
</OL>
На екрані отримаємо:
Мої улюблені предмети:
Інформатика
Англійська мова
Історія
Значення "і" чи "І" параметра TYPE задає нумерацію римськими малими (і, іі, iiі, iv,...) чи великими (І, II, III, IV, ...) цифрами, а значення "а" чи "А" – латинськими малими (a, b, c, d, ...) чи великими (А, В, С,...) буквами.
7. Вставляння графічних і відео-файлів. Графічні зображення (фотографії, картинки, піктограми тощо) зберігаються на серверах в окремих файлах з розширеннями bmp, jpg, gif та іншимиі подаються на екран клієнта за допомогою команди, що задається одинарним тегом <IMG> з параметрами:
<IMG SRC="адреса графічного файлу" ALT="альтернативний текст" ALIGN="left" WIDTH="240" HEIGHT="200">
Обов'язковим є лише перший параметр SRC. Альтернативний текст – це текст, який виводитиметься замість картинки, якщо броузер не може прийняти графічний файл, або якщо режим відображення графіки вимкнено. Параметр ALIGN задає місце розташування картинки на екрані, а параметри WIDTH і HEIGHT її розміри по ширині і висоті в пікселах або відсотках, наприклад, <IMG WIDTH="300"> задає ширину картинки 300 пікселів; <IMG WIDTH="50%"> задає ширину картинки півсторінки у горизонтальному напрямку.
Для проведення ліній різної довжини і товщини застосовують параметри WIDTH і SIZE, наприклад, тег <HR SIZE="30" COLOR= "red"> замість звичайної лінії дає червону полосу товщиною 30 пікселів.
Зображення можна подати в рамці, що рекомендують робити, якщо його використовуватимуть як гіперпосилання. Для створення рамки навколо зображення призначений параметр BORDER= "товщина рамки в пікселях".
Справа і зліва від картинки, яку обгортає текст, можна зробити вільний простір: HSPACE = "кількість пікселів". Можна створити вільний простір також над і під рисунком: VSPACE = "кількість пікселів".
За допомогою тега IMG можна вставити також відеофільм, який запускатиметься в момент відкриття Web-сторінки:
<IMG DYNSRC=" адреса відео-файлу">.
8. Адреси файлів. Для виклику віддалених файлів, тобто файлів, які є на серверах в мережі Internet, адресу записують з зазначенням назви протоколу доступу http і URL-адреси файлу, наприклад, "http://www.polynet.lviv.ua/ourpage.htm".
Для доступу до файлів на локальному диску використовують протокол доступу file: "fі1е:///диск:/ шлях до файлу".
Наприклад, "file:///d:/mycatalog/mypage.htm". Назву протоколу можна інколи не писати, наприклад, SRC="c:/windows98/ Lec.bmp".
Якщо графічні чи інші файли є в тому ж каталозі, що основний html-файл, то достатньо зазначити лише назву файлу, наприклад, SRC="myfoto.gif". Якщо файл є в деякому сусідньому каталозі images, то шлях до нього можна подати так: "../images/myfoto. gif". Отже, тег IMG може мати такий конкретний вигляд:
<IMG SRC="c:/windows98/Lec.bmp" ALT="IT">.
Завдання 2. Переробіть файл filel.htm, щоб створити списки двох видів і вставити свою фотографію або деяку картинку з Clip Art, наприклад cat.bmp,