Лабораторна робота №19 Створення шаблону html-документа. Використання команд форматування тексту

19.1 Мета: Вивчити базову структуру HTML-документа та команди логічного та фізичного форматування тексту.

19.2 Завдання.

Створити HTML-документ, який міститиме ваше резюме – стислу інформацію про вас, вашу освіту, вивчені предметні курси, досвід практичного використання здобутих знань та навичок, прагнення щодо подальшого здобуття знань та працевлаштування.

19.3 Порядок виконання роботи.

19.3 1 Відкрити текстовий редактор.

19.3.2 Записати шаблон HTML-документа.

19.3.3 Заповнити заголовок документа. Записати відомості про автора і дату створення документа.

19.3.4 Записати текстову частину в тілі документа. Текст повинен бути структурованим за змістом. Кожна завершена за змістом частина тексту повинна мати заголовок. Заголовки оформити відповідними тегами мови HTML.

19.3.5 Зробити розмітку текста на абзаци з використанням відповідних тегів.

19.3.6 Застосувати логічне та фізичне форматування тексту для посилення сприйняття відповідної інформації.

19.3.7 Зберегти файл з розширенням .html і відкрити його програмою-броузером для перегляду та перевірки.

19.4 Теоретичні відомості

19.4.1 Команди мови html

Команди мови HTML називаються тегами. Тег – це простий елемент розмітки, який завжди має вигляд дескриптора, записаного у кутових дужках <дескриптор>. Теги бувають одинарними і парними. Парні теги позначають початок і кінець області дії відповідної команди, тому їх ще називають контейнерами. Тег, який закриває область дії, містить косу риску </дескриптор>. Парний тег може містити між відкриваючим та закриваючим дескриптором текст та інші теги. Тег може містити параметри, які записуються в першому блоці тега через пропуск чи з нового рядка. Нечислові значення параметрів записують у лапках.

Найпростіший HTML-документ має такий вигляд:

<HTML>

<HEAD>

<TITLE>Найпростіший HTML-документ </TITLE>

</HEAD>

<BODY>

Тут знаходиться текст документа

</BODY>

</HTML>

Весь документ міститься всередині парного тега <HTML> </HTML>. Перша частина цього документу – заголовок - міститься в контейнері <HEAD></HEAD>, всередині якого знаходиться обов’язковий тег-контейнер <TITLE> </TITLE>. Тіло сторінки знаходиться в контейнері <BODY> </BODY>.

Всередині тега-контейнера <TITLE> </TITLE> записується текст, який з’являтиметься при перегляді сторінки у заголовку вікна броузера. Тому рекомендується робити назву такої довжини, щоб вона не перевищувала ширини розгорнутого вікна броузера. Перші кілька символів назви треба старатись робити особливо значущими, тому що багато броузерів використовують цю назву в піктограмі на панелі завдань Windows, коли вікно броузера згорнуте. Текст, записаний всередині тега <TITLE> </TITLE>, використовується по замовчуванню для вкладки або посилання Favorites у броузері, тому він повинен бути інформативним.

HTML-документ може містити коментарі, які записуються всередині тегів-контейнерів <!-- --> або <COMMENT> </COMMENT>. Коментарі можуть використовуватись в процесі тестування розроблюваного документа або для запису деякої службової інформації. Текст коментарю не буде видно в броузері, але його можна побачити при перегляді з допомогою броузера даного документа у вигляді текстового файлу. Тому зайві коментарі після тестування слід вилучити з документа.

Тег-контейнер <BODY> </BODY> містить текст HTML-документа. Основна частина зусиль при створенні нового HTML-документа йде на роботу над тілом документу. Для визначення загального вигляду документа використовуються параметри, які задаються після оголошення тега <BODY> </BODY>. Перелік цих параметрів та опис їх призначення подано в таблиці 19.1.

Таблиця 19.1 - Параметри тега <BODY>

Параметр	Призначення
ALINK	Визначає колір, яким виділяється активне гіперпосилання
BACKGROUND	Вказує URL зображення, яке треба використати як фон документа
BGCOLOR	Визначає колір фона документа
BGPROPERTIES	Якщо має значення FIXED, то зображення фона не буде прокручуватись
LEFTMARGIN	Визначає ширину лівого поля в пікселях
LINK	Визначає колір гіперпосилання, яке не було відвідане
TEXT	Визначає колір текста
TOPMARGIN	Визначає ширину верхнього поля в пікселях
VLINK	Визначає колір гіперпосилання, яке було відвідане