Приклад створення web-сайту
Методичні вказівки:
Разом з викладачем розгляньте синтаксис тегів які призначені для роботи з текстом і гіперпосиланнями (таб. 4).
Таблиця 4. Синтаксис тегів для роботи з текстом і гіперпосиланнями
Ім’я тегу |
Призначення тегу, атрибути |
<HTML> </HTML> |
Тег <HTML> є контейнером, який містить у собі весь уміст веб-сторінки, включаючи теги <HEAD> і <BODY>. Закриваючий тег <HTML> повинен завжди стояти в документі останнім. |
<HEAD> </HEAD> |
Тег <HEAD> призначений для зберігання інших елементів, ціль яких — допомогти браузеру в роботі з даними. Вміст тегу <HEAD> не відображається прямо на веб-сторінці. |
<TITLE> </TITLE> |
Виводить заголовок документа. Розміщується тег в контейнері <HEAD>. |
<BODY> </BODY> |
призначений для зберігання змісту веб-сторінки (контенту), відображуваного у вікні браузера. Тег <BODY> також застосовується для визначення кольорів посилань і тексту на веб-сторінці. Атрибути bgcolor - встановлює колір фону веб-сторінки text - встановлює колір тексту, використовуваного на веб-сторінці за замовчуванням background – встановлює рисунок фоном сторінки |
<P> </P> |
призначений щоб увести в документі текстовий абзац. Аргументи left - вирівнює тексту по лівому краю right - вирівнює тексту по правому краю center - вирівнює тексту по центру justify - по ширині |
<BR> |
здійснює перехід на новий рядок |
<H1>..<H6> |
Для відображення заголовків від 1 до 6 рівня. Синтаксис <h1>Заголовок 1-го рівня</h1> <h2>Заголовок 2-го рівня</h2> ... <h6>Заголовок 6-го рівня</h6> |
<b> </b> |
Установлює жирне накреслення шрифту |
<i> </i> |
Установлює курсивне накреслення шрифту. |
<sub> </sub> |
Відображає шрифт у вигляді нижнього індексу.
|
<suр> </suр> |
Відображає шрифт у вигляді верхнього індексу.
|
<FONT> </FONT> |
контейнер для зміни характеристик шрифту, таких як розмір, колір і гарнітура. Атрибути сolor - колір тексту face - гарнітури шрифтів, що використовуються для тексту. size - розмір шрифту в умовних одиницях від 1 до 7. |
<big> </big> |
збільшує розмір шрифту на одиницю в порівнянні зі звичайним текстом.
|
<а> </а> |
призначений для створення посилань. Атрибути href - задає адресу документа, на яку слід перейти. |
<li> </li> |
визначає окремий елемент списку. Зовнішній тег <UL> або <OL> установлює тип списку — маркірований або нумерований. Атрибути <ul> <li>елемент маркірованого списку</li> </ul> <ol> <li>елемент нумерованого списку</li> </ol> |
<ol> |
створює нумеровані списки Атрибути start- визначається початкове значення списку type - визначає спосіб нумерації елементів списку, може приймати значення: A – прописні латинські букви A, B, C …; а - рядкові латинські букви a, b, c …; I – великі римські цифри I, II, III …; i – малі римські цифри і, іі, ііі …; 1 – арабські цифри 1, 2, 3 … |
<ul> </ul> |
установлює маркірований список. Кожний елемент списку повинен починатися з тегу <LI> |
Завантажте програму Блокнот (з групи стандартних програм).
У середовищі програми Блокнот введіть текст HTML- документу і збережіть його в папці із своїм прізвищем з іменем index.htm
Запустіть створений файл index.html у вікні програми – браузеру
Для перегляду та редагування сторінки web-сайту виконайте команди Вид-Просмотр HTML-кода.
Проаналізуйте елементи коду, яку роль вони відіграють при створенні Web-сторінки.