МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
НАЦІОНАЛЬНИЙ УНІВЕРСИТЕТ «ЛЬВІВСЬКА ПОЛІТЕХНІКА»
ІНСТИТУТ КОМП’ЮТЕРНИХ НАУК ТА ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ
кафедра інформаційних технологій видавничої справи
ЗВІТ
до лабораторної роботи № 3
з курсу:
«Web-технології»
Тема роботи: Списки та гіперпосилання в HTML.
Мета роботи: вивчити основні методи і засоби створення списків та гіперпосилань засобами HTML.
Короткі теоретичні відомості
HTML має спеціальні елементи-контейнери для представлення даних у вигляді списків. Основними типами списків є нумеровані і марковані списки, списки визначень.
Упорядкований (нумерований) список – <OL> ... </OL>. Кожен пункт списку має міститись між відкриваючим і закриваючим елементом <LI> ... </ LI>. Всередині списку можна застосовувати теги стилів та інші елементи HTML.
Неупорядкований (маркований) список – <UL> … </UL>. Для тега <UL> в HTML можна встановлювати вид маркерів за допомогою атрибуту TYPE, який допускає три значення: disc, square і circle.
Список визначень (глосарій) – є особливим видом списків HTML. Вони подають текст у формі словникової статті, що складається з обумовленого терміну та абзацу, який розкриває його значення. Елемент списку визначень <DL> … </DL> є контейнером і забезпечує відділення списку від решти тексту порожніми рядками. Всередині контейнера тегом <DT> позначається кожний термін, а тегом <DD> – абзац з його визначенням. Теги < DT > і < DD > не є контейнерами і тому не мають закриваючих тегів.
Комбінування списків. Існує ряд прийомів, що дозволяє більш ефективно маніпулювати списками і їх атрибутами. До них відносяться вкладені списки, використання списків для відступів і зміни атрибутів списків.
Гіперпосилання в HTML
Гіперпосилання – активний елемент одного документа, при натисканні на який відбувається перехід до іншого документу або до його елементу; рядок з адресою однієї вебсторінки (або елемента цієї сторінки), розміщений на інший веб-сторінці. Документи, що містять гіперпосилання, називаються гіпертекстовими.
Класифікація гіперпосилань
В основі класифікації гіперпосилань лежить ряд критеріїв.
Залежно від форми подання розрізняють такі типи гіперпосилань: текстові, графічні.
По об’єктах, на які посилаються гіперпосилання, виділяють: гіперпосилання на веб-сторінки, посилання на елементи всередині певної веб-сторінки, гіперпосилання на «якоря» (посилання, при активації яких здійснюється перехід в певні місця всередині одного і того ж документа), на електронну пошту, на документи, які знаходяться на FTP-сервері, на мультимедійний контент.
В залежності від сайту, на який виконується перехід після активації гіперпосилання, класифікують: локальні (або внутрішні), глобальні (або зовнішні) гіперпосилання.
За станом гіперпосилань виділяють такі типи: невідвідані, активні (дуже короткочасний стан гіперпосилання в момент її активації), відвідані.
«Битими» прийнято називати гіперпосилання, які посилаються на відсутній документ або його елемент.
До абсолютних посилань відносяться повні URL-адреси документів, включаючи назву використовуваного протоколу (зазвичай http:// для вебсторінок). На веб-сайтах корінь позначається косою рискою – «/». / – це не просто паличка, а самостійний АДРЕСА, шлях.
За статистикою, відносні посилання використовуються частіше ніж абсолютні.
Існує два види відносних посилань:
• посилання відносно документа (використовується найчастіше);
• посилання відносно кореня сайту.
Створення гіперпосилань
Тег <A> … </A> є одним з важливих елементів HTML і призначений для створення посилань. Залежно від присутності атрибутів NAME або HREF тег <A> встановлює посилання або якір. Для створення посилання необхідно повідомити браузеру, що є посиланням, а також вказати адресу документа, на який слід зробити посилання.
Посилання всередині сторінки
Великі документи читаються краще, якщо вони мають зміст з посиланнями на відповідні розділи. Для створення посилання слід спочатку зробити закладку (якір) у відповідному місці сторінки (в тому місці куди має здійснитись перехід по сторінці) і дати їй ім’я за допомогою атрибуту NAME тега <A>. Ім’я посилання на закладку починається символом #, після чого йде назва закладки. Назва вибирається будь-яке, відповідне тематиці. Створення посилання на мітку <A HREF=«#мітка»>Власне посилання на мітку</A>.
Порядок виконання роботи
Створив маркований список:
з чотирьох елементів: перші два елементи списку представлені квадратом, інші два колом;
з п’яти елементів: перші два представлені диском, решта – квадратами.
Створив нумерований список:
з трьох елементів: тип маркера римські цифри;
з трьох елементів: тип маркера арабські цифри, де нумерація відбувається починаючи від дня вашого народження з кроком в номер місяця народження (наприклад, для дня народження 10 травня, нумерація буде 10, 15, 20).
з трьох елементів: тип маркера маленькі латинські літери зі зворотною нумерацією.
3. Створив глосарій на певну тематику.
4. Створив абсолютний лінк на відомий сайт.
5. Створив відносний лінк на файл не вказуючи повного шляху.
6. Створив навігацію по сторінці зверху-донизу і знизу догори.
7. Створив поштовий лінк через малюнок.
Результати виконання індивідуального завдання
Лістинг HTML-файлу
Результат виконання
<HTML>
<HEAD>
<META HTTP-EQUIV = "Content-Type" CONTENT ="text/html; charset = windows-1251">
<META NAME = "description" CONTENT = "Лабораторна №1">
<META NAME = "author" CONTENT = "Студент групи ВП-41,Діжак Андрій">
<META NAME = "keywords" CONTENT = "HTML, web, дизайн">
<TITLE>
Лабораторна №3
</TITLE>
</HEAD>
<BODY>
<BODY BACKGROUND="Pnt.png">
<A NAME="мітка1"></A>
<A HREF="#мітка2">Push</A>
<UL style="#DC143C" type="disc"> <BIG><STRONG>Види тварин</BIG></STRONG>
<li type="square">Ссавці</li>
<li type="square"> Птахи;</li>
<LI type="circle"> Земноводні;</LI>
<LI type="circle"> Комахи.</LI>
<em> Основні типи і класи тварин:</em>
<li type="disc"> найпростіші,</li>
<li type="disc"> губки,</li>
<li type="square"> кишковопорожнинні,</li>
<li type="square"> плоскі черви,</li>
<li type="square"> круглі черви,</li>
<em>Безхребетні:</em>
<ol>
<OL type="I">
<li>Павукоподібні</li>
<li>Первиннотрахейні.</li>
<li>Мечохвости.</li>
</ol>
</OL>
<OL style="color:green" START="7"> <BIG><STRONG>Birthdays:</BIG></STRONG>
<li> Andrii Dizhak</li>
<li value="19"> Ivan Bogun</li>
<li value="31"> Bogdan Oleskiy</li>
</OL>
<OL style="color:008080" REVERSED type="a"> <BIG><STRONG>За станом гіперпосилання поділяються:</BIG></STRONG>
<LI> невідвідані</LI>
<LI> активні</LI>
<LI> відвідані</LI>
</OL>
<DL style="color:DC143C"><BIG><STRONG>Глосарій термінів <ABBR TITLE="Триптофа́н"></ABBR></BIG></STRONG>
<DD> абразив - abrasive. Дуже тверда, термостійка речовина, яка використовується для
шліфування необроблених чи шорстких поверхонь об’єктів.
Пр., карбід бору, алмаз, корунд.
<DT><I><B>абляція</I></B>
<DD> Складний процес ерозії та дезінтеграції матеріалів, що відбувається під дією тепла. Може включати павлення, випаровування, сублімацію.
<DT><I><B>абіотичний фактор</I></B>
<DD> У хімічній екології — фактор, що впливає на процеси в довкіллі, не викликаний діяльністю живих організмів, напр., температура, вологість, вітер, рН середовища та інші фізичні або хімічні чинники.
<DT><I><B>абіотичне перетворення </I></B>
<DD>Процес перетворення хімічних речовин у довкіллі за небіологічними механізмами. Сюди відносять хімічні реакції окиснення, відновлення, гідролізу, розкладу під дією кислот чи основ,а також фізико-хімічні процеси адсорбції, фотохімічні реакції та інш.
<DT><I><B>абсолютний метод</I></B>
<DD> У хемометриці — метод, де використовуються лише фізично(абсолютно) визначені стандарти.
<A TARGET="_blank" HREF="https://www.facebook.com/">FACEBOOK</A>
<BR>
<A HREF="VP-41/WEB-технології/monkey.png/">PNG</A>
<BR>
<A HREF="#мітка1">Push</A>
<A NAME="мітка2"></A>
<A HREF="Mail to:Andrij8991@gmail.com"><IMG SRC="kotys.PNG"></A>
</BODY>
</HTML>
</BODY>
</HTML>
Результат виконання
//
Висновок: під час виконання лабораторної роботи я вивчив основні методи і засоби створення списків та гіперпосилань засобами HTML.