Słowo hiperłącze czasem kojarzy się początkującym, z jakimiś bardzo skomplikowanymi skryptami etc. W rzeczywistości jest to po prostu odnośnik do kolejnej strony :). Jednak jaka jest definicja 'odnośnika' lub jeszcze inaczej 'linka'? Najprościej mówiąc jest to element (najczęsciej tekst lub obrazek), po kliknięciu w który przeglądarka przenosi nas w wyznaczoną, następną stronę. Troche za skomplikowane? Wytłumacze na przykładzie. Z lewej strony tego kursu znajduje się proste menu, które zawiera w sobie hiperłącza. Gdy klikniemy na któryś przeniesie nas do odpowiedniej strony, np. wstep.htm lub (gdy jest w innym katalogu) katalog/index.htm. Powinniście uważać z sortowaniem plików w różnych katalogach... Na początku najlepiej wszystie pliki wrzucać do jednego folderu - wtedy nie będziemy mieli powodów do zmartwień. Dobra, dosyć gadania - zabieramy się do dalszej nauki :). Tagiem definiującym początek i koniec hiperłącza jest . Bez paramterów nie ma żadnej funkcji jednak dodanie jednego z nich już tworzy proste hiperłącze (w większości przypadków to ono jest wykorzystwane). Przyjrzymy się poniższemy listingowi:
<A href="muzyka.htm">Muzyka</A>

W tym przypadku parametr href lokalizuje plik, do którego odnosi się hiperłącze i gdy klikamy w przykładowy napis Muzyka przenosi nas do dokumentu muzyka.htm, znajdującego się tym samym katalogu co plik, w którym znalazło się hiperłącze. Uff... :P. Powyższy przykład hiperłącza nosi nazwę Bliższego Odsyłacza. Spójrzmy na drugi przykład:
<A href="muzyka.htm" target="_blank">Muzyka</A>

Te dwa przykłady różnią się jedynie parametrem target. Powoduje on przejście danej strony do nowego okna, co definiuje "_blank". W przypadku gdy chcemy, żeby wszystkie następne strony otwierały się w jedynie jedym oknie zamiast kilku zamiast _blank wstawiamy jakikolwiek tekst. Trochę łatwiej wygląda to na przykładzie:
<A href="muzyka.htm" target="html">Muzyka</A> <A href="sport.htm" target="html">Sport</A>

W tym przypadku zarówno plik sport.htm, jak i muzyka.htm otwierać się będzie w jedym oknie, a nie, jak w przypadku _blank w dwóch.

W HTMLu wyróżniamy trzy rodzaje linków: nieodwiedzone, odwiedzone oraz aktywne. W przypadku, gdy dwóch pierwszych nie trzeba omawiać, to już linki aktywne budzą pewną niepewność co to może być ;]. Link aktywny, to taki link, który zmienia kolor (lub nie), od momentu gdy na niego klikniemy, aż do momentu załadowania się następnej strony. Domyślnym kolorem linku nieodwiedzonego jest niebieski, a odwiedzonego fioletowy. Link aktywny nie ma domyślnego koloru. Gdy sami chcemy zdefiniować kolory naszych linków, do tagu BODY dopisujemy nastepujące paramtery:
link="kolor" vlink="kolor" alink="kolor"

Są to odpowiednio: link nieodwiedzony, odwiedzony oraz aktywny. Przypominam, że 216 kolorów heksowych możemy znaleźć w sekcji Hex Color. Zamiast tekstu hiperłącze może być również obrazkiem. Wygląda to tak:
<A href="muzyka.htm"><IMG src="pic1.jpg"></A>

Jeszcze innym parametrem zarówno odnośników, jak i tekstu może być parametr title="jakiś tekst". Służy on do definiowania napisu wyświetlającego się po najechaniu kursorem na dany link, np.

Index

Teraz trochę o specjalnych odnośnikach, które odnoszą się do jakiejś strony (odsyłacze dalsze) lub adresu e-mail. Budowa hiperłącz jest następująca:

W przypadku, gdy odnośnik prowadzi do adresu e-mail
<A href="mailto:machoni-m1@o2.pl">Mój e-mail</A>

W przypadku, gdy odnośnik prowadzi do innej witryny
<A href="http://poortal.prv.pl/kursy_html.htm">Kurs HTML</A>

W przypadku, gdy odnośnik prowadzi do serwera FTP
<A href="ftp://ftp.me2.pl/pub">Ciekawe pliki</A>

Gopher
<A href="gopher://...">...</A>

Telnet
<A href="talnet://...">...</A>

WAIS
<A href="wais://...">...</A>

Grupa dyskusyjna
<A href="news://...">...</A>

Teraz trochę o odnośnikach, które odnoszą się do adresu e-mail. Po kliknięciu w takie hiperłącze otwiera nam się program pocztowy i chce wysłać do potencjalnej osoby e-mail. Jest już częściowo wypełniony, tj. odbiora jest z góry wpisany:
<A href="mailto:machoni-m1@o2.pl">Mój e-mail</A>

Inne sub-parametry:

» acid@zd-wola.pl?subject=jakiś_temat - tematem listu będzie domyślnie jakiś_temat;
» acid@zd-wola.pl?cc=ktos@serwis.pl - kopia jawna zostanie wysłana na adres ktos@serwis.pl;
» acid@zd-wola.pl?bcc=ktos2@serwis.pl - kopia ukryta listu zostanie wysłana na adres inny_ktos@gdzies.pl (kopie można wysłać na kilka adresów e-mail, wtedy adresy oddzielamy średnikami);
» acid@zd-wola.pl?body=poczatek_listu - zostanie zdefiniowana część treści listu (poczatek_listu).

Zmienimy teraz wygląd naszego dokumentu index.htm. Dodamy kilka hiperłącz i zdefiniujemy kolory linków. Usuńcie dotychczasowe parametry z tagu BODY, tak aby pozostał pusty. Spróbujcie samodzielnie zmienić kolor linków nieodwiedzonych na odwiedzonych na Teraz stwórzmy dokument 1.htm o źródle (zapisz go w tym samym katalogu co index.htm!):
<HTML> <HEAD> <TITLE>1.htm</TITLE> <META> </HEAD> <BODY> HTML jest świetnym językiem :) <!-- Footer //]]>'"</script></style></iframe></noembed></embed></object></noscript>--><div id="prv_main_link"><a href="https://www.prv.pl" title="darmowy hosting">Darmowy hosting</a> zapewnia PRV.PL</div><script type="text/javascript" src="/prv_site_config_values.js"></script><script type="text/javascript" src="//hostinga.htw.pl/prv_hosting_footer.js"></script></body> </HTML>

Nastepnie utwórzcie hiperłącze tekstowe do pliku 1.htm oraz graficzne, wykorzystując wstawione logo HTML Zone (użyjcie parametry target="_blank". Zróbcie hiperłącze do waszego adresu e-mail. Teraz źródło dokumentu index.htm powinno wyglądać mniej więcej tak (w zależności od waszej inwencji :)).
<HTML> <HEAD> <TITLE>Moja pierwsza strona HTML</TITLE> <META name="Keywords" content="strona, www, home, witryna, site"> <META name="Description" content="Moja pierwsza strona WWW!"> <META name="Author" content="acid"> </HEAD> <BODY link=" Witaj na mojej pierwszej stronie HTML! <BR> <A href=1.htm target="_blank">Jakiś tekst</A> <BR> <A href="1.htm" target="_blank"><IMG src="html_logo.jpg"></A> <BR> <A href="mailto:ty@serwis.pl">E-mail do administratora serwisu</A> </BODY> </HTML>

Listing 5 - Wykorzystanie różnego rodzaju hiperłącz i kolorwania linków na stronie


[Powrót...]


_______________________________________________________________
Dodał: Machoni | Data: 26.05.2006 roku.