
- •Лабораторна робота №1
- •Список базових тегів html
- •Атрибути тегу body
- •Крок 1: Структура Web- сторінки
- •Крок 2: Заголовки.
- •Крок 4: Параметр горизонтального вирівнювання тексту
- •Крок 5: Форматований текст
- •Крок 6: Цитата
- •Крок 7: Стилі
- •Крок 8: Шрифти
- •Крок 9: Лінії та коментарі
- •Крок 10:Колір
- •Крок 11:Колір фону
- •Крок 12: Фоновий малюнок
- •Крок 15: Фоновий малюнок
Лабораторна робота №1
Тема: Основи WEB-дизайну
Мета: Навчитися створювати WEB сторінку, використовувати теги форматування та аналізувати їх вплив на зовнішній вигляд WEB - сторінці.
Теоретична частина:
Список базових тегів html
Начальний |
Кінцевий |
Опис |
<HTML> |
</HTML> |
Позначення HTML- документу |
<HEAD> |
</HEAD> |
Заголовочна частина документу |
<TITLE> |
</TITLE> |
Заголовок документу |
<BODY> |
</BODY> |
Тіло документу |
<H1> |
</H1> |
Заголовок абзацу першого рівня |
<H2> |
</H2> |
Заголовок абзацу другого рівня |
<H3> |
</H3> |
Заголовок абзацу третього рівня |
<H4> |
</H4> |
Заголовок абзацу четвертого рівня |
<H5> |
</H5> |
Заголовок абзацу п’ятого рівня |
<H6> |
</H6> |
Заголовок абзацу шостого рівня |
<P> |
</P> |
Абзац |
<PRE> |
</PRE> |
Форматований текст |
<BR> |
|
Перевід строки без кінця абзацу |
<BLOCKQUOTE> |
</BLOCKQUOTE> |
Цитата |
Атрибути тегу body
Атрибут |
Призначення |
alink |
Визначає колір активного посилання |
background |
Вказує на URL-адресу рисунка, який використовується як фоновий |
bgcolor |
Визначає колір фона документа |
bgproperties |
Якщо встановлено FIXED - фонове зображення не прокручується |
leftmargin |
Встановлює межу лівого поля у пікселях |
link |
Визначає колір посилання який ще не відкривали |
text |
Визначає колір тексту |
topmargin |
Встановлює межу верхнього поля в пікселях |
vlink |
Визначає колір посилання яке вже відкривали |
Практична частина:
Крок 1: Структура Web- сторінки
Відкрийте програму Блокнот зі стандартного набору Windows.
В блокноті наберіть текст (те що у рамці):
<html>
<head>
<title> Мій перший крок </title>
</head>
<body>
Доброго дня!
Це моя перша сторінка.
<br>
Ласкаво просимо!
</body>
</html>
Збережіть файл у вашій папці з ім’ям ВашеПрізвище_1.html.
Закрийте програму Блокнот.
Відкрийте вашу папку. Який ярлик має створений вами файл?
Відкрийте ваш документ двічі клацнув на ньому мишею. У який програмі він відкрився?
Де знаходиться фраза «Мій перший крок»?
Як розташовані на WEB – сторінці речення: «Доброго дня! Це моя перша сторінка. Ласкаво просимо!»? Чому?