 |
Завдання до лабораторної роботи
|
|
|
|
Завдання №1
1. Створіть на диску D папку Web. У папці Web створіть Web-сторінку, яка повинна відображати список знаків зодіаку. Список знаків зодіаку представте у вигляді маркованого списку. Документ повинен мати назву index.html.
2. За допомогою MS Word створіть два HTM-документи, які будуть відображати інформацію про відповідний знак зодіаку, наприклад, документи lion.htm та scorpion.htm. Вставте до створених файлів два довільні зображення. Збережіть створені HTM-документи в папці Web.
3. Створити в документі index.html два гіперпосилання до створених файлів, наприклад, до файлів lion.htm та scorpion.htm відповідно.
4. Додайте на Web-сторінку index.html два абзаци, які містять інформацію про два знаки зодіаку. Створіть гіпертекстові посилання в документі index.html на створені абзаци.
5. Створіть у кінці документа index.html гіпертекстове посилання, на початок документа index.html.
6. Створіть у документі index.html гіпертекстове посилання на будь-який файл, що перебуває на диску D.
Завдання №2
1. Створити на диску D папку Web_2. У папці Web_2 створіть Web-сторінку з назвою reference.html.
2. Добдайте до створеної Web-сторінки reference.html два будь-яких gif зображення.
3. Змінити перше зображення, виставивши його ширину 180 (висота вираховується автоматично).
4. Змінити друге зображення, зробивши його ширину 80.
5. Створіть у документі reference.html нумерований список, який повинен міститися після першого зображення. Нумерація в списку повинна бути арабськими цифрами.
Приклад:
<OL type=l>
<li> Людина набагато розумніша, ніж їй це треба для щастя.
<li> Нікому не поставити нас на коліна! Ми лежали і будемо лежати!
<li> Думаю, не помилюся, якщо промовчу.
<li> Прошу послати мене на курси підвищення зарплати.
|
|
|
</OL>
6. Додайте до сторінки reference.html ще один нумерований список, який повинен міститися після попереднього. Нумерація в списку повинна бути великими римськими цифрами і починатися з чотирьох.
Приклад:
<OL type=A>
<li> Життя, звичайно, не вдалася, а в іншому все нормально.
<li> Якщо вам довго не телефонують родичі або друзі, значить у них усе добре.
<li> Вибачите, що я говорю, коли ви перебиваєте.
</OL>
7. Відокремити перше зображення від тексту по вертикалі й по горизонталі по 20 пікселів.
8. Додайте до сторінки reference.html третє зображення. Зробити третє зображення в рамці, товщина якої 10 пікселів.
9. Додати до першого зображення альтернативний текст.
10. Зробити наприкінці сторінки посилання у вигляді графічного зображення.
Приклад:
<IMG src=D:\distr_fom\FOTO\веб\ E-MAIL\5.gif align=right alt="Простий малюнок">
Приклад виконання завдання:
<head>
<title>Закони Мерфи</title>
</head>
<body>
<IMG src=D:\distr_fom\FOTO\веб\ E-MAIL\5.gif align=right WIDTH=180 HSPACE=20 VSPACE=20 alt="Простий малюнок">
<OL type=l>
<li>Людина набагато розумніша, ніж їй це треба для щастя.
<li> Нікому не поставити нас на коліна! Ми лежали і будемо лежати!
<li> Думаю, не помилюся, якщо промовчу.
<li> Прошу послати мене на курси підвищення зарплати.
</OL>
<ol type=I start=5>
<li> Ціль визначає калібр.
<li> Першим вітається той, у кого слабіші нерви.
<li> Мудрість не завжди приходить із віком. Буває, що вік приходить один.
</OL>
<OL type=A>
<li> Життя, звичайно, не вдалася, а в іншому все нормально.
<li> Якщо вам довго не телефонують родичі або друзі, значить у них всі добре.
<li> Вибачите, що я говорю, коли ви перебиваєте.
</OL>
<br> Мало знати собі ціну-<IMG src=D:\distr_fom\FOTO\веб\ E- MAIL\23.gif align=absmiddle WIDTH=80 border=10 bordercolor=red > треба ще користуватися попитом
<p> <IMG src=D:\distr_fom\FOTO\веб\GERB\usa.gif align=bottom >Якщо дружина зненацька дарує вам краватку, виходить,
<BR> нова норкова шубка їй уже не подобається.
|
|
|
<A hrif=E:\Documents and Settings\vika\Мої документи\HTML\Мерфи.doc> <IMG src=D:\distr_fom\FOTO\веб\OTHER\book.gif></A>
</body>
</html>
Контрольні питання
1. Що таке внутрішнє гіперпосилання? Як воно організується?
2. Що таке зовнішнє гіперпосилання? Як воно організується?
3. Що таке абсолютна й відносна адреси файлу?
4. Як використовувати зображення у вигляді гіперпосилання?
|
|
|
