- •Лабораторна робота 1: Частина 1: html. Поняття про мову. Головні теги Теорія:
- •Структура html-документа
- •Назва документу
- •Тіло документа
- •Завдання
- •Частина 2: Форматування тексту, робота з кольором Теорія: Кольорове оформлення документа
- •Поділ тексту на абзаци
- •Горизонтальні лінії
- •Форматування гіпертексту
- •Логічне форматування
- •Фізичне форматування
- •Попередньо відформатований текст
- •Завдання:
- •Частина 3: Робота із зображеннями, навігація по документу Теорія: Використання графіки в html-документах
- •Гіперпосилання
- •Абсолютний і відносний url
- •Гіперпосилання в межах одного документа
- •Посилання на поштову скриньку
- •Завдання:
Гіперпосилання в межах одного документа
Інша форма тега <A> призначена для присвоювання імені деякого фрагменту документа HTML:
<A NAME="імя">фрагмент документа</A>
Тег <A> часто називають тегом якоря (anchor). Якщо якір застосовується для додавання позначки (імені) до фрагмента документа, то його називають іменованих якорем.
Для того щоб послатися на фрагмент, якому присвоєно ім'я, використовується наступна форма тега <A>:
<A HREF="URL_ресурса#імя">Текст посилання</A>
Якщо потрібно послатися на фрагмент поточного документа, то URL-ресурсу можна опустити:
<A HREF="#імя"> Текст посилання </A>
Приклад
Нехай у документі з ім'ям book.html заголовком глави 2 присвоєно ім'я chapter2:
<A NAME="chapter2"> Глава 2 </A>
Тоді посилання на цю главу, розташована в цьому ж документі, буде мати вигляд:
<A HREF="#chapter2"> Глава 2 </A>
Для завдання посилання на цю ж мітку файлу book.html з іншого файлу потрібно написати:
<A HREF="book.html#chapter2"> Глава 2 </A>
Посилання на поштову скриньку
Для того щоб створити посилання на поштову скриньку, напишіть:
<A HREF=mailto:адрес_e-mail> текст посилання </A>
Тут замість адрес_e-mail потрібно поставити адресу поштової скриньки. Після того, як відвідувач активізує цю посилання, у нього на екрані з'явиться спеціальне вікно, що дозволяє надіслати листа за вказаною адресою.
Приклад
<A HREF=mailto:sidorov@mail.msiu.ru> Пошта автору </A>
Завдання:
Робота із зображеннями, навігація по документу
-
Розібратись з основними тегами HTML, призначеними для роботи із зображеннями та гаперпосиланнями.
-
Створити HTML-документ image.html, додати до нього будь-яке зображення.
-
Для зображення в HTML-документі встановити наступні парметри: ширина рамки -- 3 пікселі; вирівнювання -- по правому краю; відстань навколо зображення -- 5 пікселів; задати альтернативний текст для зображення.
-
Додати у документ будь-який текст таким чином, щоб він обтікав малюнок.
-
Створити HTML-документ link.html, додати до нього будь-який текст у такій кількості, щоб він не уміщався у вікні браузера.
-
Останньому слову у тексті присвоїти ім'я END. На початку документа створити два гіперпосилання, одне на файл image.html, інше на останнє слово в документі.
-
Скопіювати файл Вашої автобіографії із попередньої роботи
-
Створити швидку навігацію по Вашій Web-сторінці за допомогою гіперпосилань: На початку сторінки зробити зміст по всіх заголовках у вигляді гіперпосилань на ділянки тексту, де вони розташовані. Передбачити швидке повернення до змісту після кожного розділу у вигляді гіперпосилання (як приклад можна розглядати структуру розділу теорія у лабораторній роботі №2).
-
Додати до автобіографії свою фотокартку. Зробити так, щоб при натисканні на Вашу фотокартку відкривалось вікно відправки повідомлення на Вашу поштову скриньку.
-
Автобіографію зберегти у файлі biography.html