Мова розмітки гіпертексту HTML. Створення гіперпосилань, зображень у web-документі: Методичні вказівки до лабораторного заняття № 2

Страницы работы

Содержание работы

МЕТОДИЧНІ ВКАЗІВКИ ДО ЛАБОРАТОРНОГО ЗАНЯТТЯ № 2

Тема: МОВА РОЗМІТКИ ГІПЕРТЕКСТУ HTML

Тема заняття:  Створення гіперпосилань, зображень у web- документі

Мета навчальна: Оволодіти навичками створення гіперпосилань у Web- документі

Забезпечення заняття: персональний комп’ютер, принтер, ОС Windows ХР, редактори MS Word та Блокнот, браузер Internet Explorer

Вимоги до оформлення звіту з лабораторної роботи.Звіт повинен містити: дату, тему, зміст заняття,  короткий виклад завдань, результати роботи, відповіді на запитання.

Критерії оцінювання: Робота виконана в повному обсязі з оформленням звіту та захистом оцінюється в 5 балів, при незначних помилках - 4 бали, при значних помилках - 3 бали, робота виконана з грубими помилками, частково або незахищена - 2 бали.

Зміст заняття

1.  Створення та збереження «пустого» файлу.

2.  Створення простого документа  HTML.

3.  Створення та редагування тексту.

4.  Створення на сторінці фону у вигляді рисунку.

5.  Створення на Веб - сторінці звичайного фону.

6.  Вставка рисунків у Веб - сторінку.

7.  Створення гіперпосилань у Web документі.

8.  Створення закладок та гіперпосилань у документі Word.

                      Контрольні запитання

1.  Який порядок створення Веб - сторінки?

2.  Що таке гіпертекст?

3.  Що таке гіперпосилання?

4.  На що можна зробити гіперпосилання?

5.  Як створити фон на Веб - сторінці?

6.  Які види фону можна зробити на Веб - сторінці?

7.  Як створити закладку?

8.  Яка клавіша використовується для активізації гіперпосилання?

Завдання та порядок їх виконання

Завдання 1. Створення та збереження «пустого» файлу

1.  Завантажте редактор Блокнот. Збережіть пустий документ з ім’ям перший.html у папці гіпер*. При збереженні зверніть увагу на Тип файла: Все файлы.

2.  Закрийте файл перший.html.

Завдання 2. Створення простого документа  HTML

1.  Завантажте файл перший.html.

2.  У програмі Internet Explorer виконайте команди Вид ► Просмотр HTML – кода. Ви побачите порожню сторінку редактора Блокнот.

3.  Створіть у редакторі Блокнот наведений нижче документ HTML
<HTML>
<HEAD> < TITLE>  Гіперпосилання </TITLE> </HEAD>
< BODY >
Гіперпосилання
</BODY>
</HTML>

4.  У редакторі Блокнот виконайте команди: Файл ►Сохранить. Закрийте файл.

5.  У вікні програми Internet Explorer виконайте команди Вид ►Обновить. Прогляньте документ.

Завдання 3. Створення та редагування тексту

1.  У вікні програми Internet Explorer виконайте команди Вид►Просмотр HTML – кода.

2.  Створіть заголовок тексту з вирівнюванням по центру. Для цього після тегу <body> перед заголовком Гіперпосилання поставте тег <H3 align=center>, а після заголовку </Н3>.

3.  Введіть у документі наведений нижче текст Гіперпосилання. Текст розташуйте в абзаці, скориставшись тегами <p></p>.

6.  Виконайте команди: Файл ►Сохранить, Вид►Обновить. Прогляньте документ. Закрийте файли.

Гіперпосилання

В звичайному текстовому документі будь-якому об’єкту (текстовому фрагменту, малюнку тощо) можна додати визначені властивості за допомогою мови програмування HTML. Такі об’єкти становляться активними (активними словами, малюнками - інакше командами).

Ці активні об’єкти мають назву гіперпосилання, а текст з такими гіперпосиланнями становиться гіпертекстом, тобто розширеним текстом - текстом з додатковими елементами. У документі гіперпосилання виділяються кольором. Гіперпосилання посилаються на різні об’єкти документа: фрагменти тексту, рисунки, таблиці, текстові та мультимедійні файли, Web – сторінки, електронні адреси, інші документи.

При наведенні покажчика мишки на гіперпосилання з’являється спливаюча підказка, а при активізації гіперпосилання на екрані з’явиться пов'язаний з ним об’єкт. Створюють такі гіпертексти в будь-якому текстовому редакторі.

Завдання 4. Створення на сторінці фону у вигляді рисунку

1.  Скопіюйте у папку гіпер* з папки Мои рисунки будь який рисунок. Перейменуйте ім’я файлу рисунку у папці гіпер* на малюнок1. Пробіл в імені файлу заборонений. Можна скористатись рисунком не тільки з папки Мои рисунки; можна і з цифрової камери.

2.  Завантажте файл перший.html. Перейдіть у режим перегляду HTML-коду.

3.  Зробіть фоном Веб-сторінки файл малюнок1. Для цього змініть тег <body> на
<body background=малюнок1.jpg>. Виконайте команди: Файл ►Сохранить, Вид ► Обновить. Прогляньте документ.

Завдання 5. Створення на Веб - сторінці звичайного фону

1.  Фон Веб - сторінки можна зробіть скориставшись шістнадцятирічними кодами кольору формату RGB, в якому чорний колір представляється  #000000, білий – #FFFFFF, червоний – #FF0000, жовтий – #FFFF00, бірюзовий - #408080.
Зробіть фон Веб-сторінки, скориставшись шістнадцятирічнім кодом. Для цього змініть тег з фоном  п. 4.3 на тег  <body bgcolor=#dd0000>.
Виконайте команди: Файл ►Сохранить, Вид►Обновить. Прогляньте документ.

2.  Фон Веб-сторінки можна зробіть, скориставшись англійськими словами, які визначають колір: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow.  

3.  Змініть тег з фоном  п. 5.1  на тег  <body bgcolor=green>. Виконайте команди: Файл►Сохранить,  Вид ►Обновить. Прогляньте документ. Зробіть висновки відносно використання команд bgcolor та background.

Завдання 6. Вставка рисунків у Веб-сторінку

1.  На Веб-сторінці можна розташувати різні картинки. Створіть у документі після першого абзацу ще один абзац, в якому розташуйте наступну конструкцію (в якій визначена довжина і висота рисунку): <p align=center><img src=малюнок.jpg width=300 height=300></p>

2.  Виконайте команди: Файл ►Сохранить, Вид ►Обновить. Прогляньте документ.

Завдання 7. Створення гіперпосилань у Webдокументі

1.  У Веб-документі можна створити гіперпосилання на файли. Це можна побачити на наступному прикладі.

2.  Змініть початок документа на наступний:   <body bgcolor=green> <H3 align=center>
<a href=малюнок.jpg> Гіперпосилання </a></Н3>.

3.  Виконайте команди: Файл ►Сохранить, Вид ►Обновить. Прогляньте документ.

4.  Активізуйте заголовок Гіперпосилання. Зробіть висновки.

5.  Скопіюйте текст Гіперпосилання (не коди). Закрийте файли.

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

1.  Завантажте MS Word. Виконайте вставку тексту з буферу обміну. Зніміть з тексту усе форматування. Збережіть документ у файлі з ім’ям перший.doc у папці гіпер*.

2.  Відредагуйте документ, створіть Зміст з пунктом 1. Гіперпосилання.

3.  Зробіть для слова Зміст гіперпосилання на файл перший.html (команди Вставка ►Гиперссылка). Виконайте гіперпосилання.

4.  Виділіть перше слово Гіперпосилання у тексту і зробіть для нього закладку за допомогою команд Вставка ►Закладка.Ім’я закладки – гіпер. Зробіть для пункту змісту 1. Гіперпосилання гіперпосилання на закладку. Виконайте гіперпосилання. Результати збережіть.

Похожие материалы

Информация о работе