Kurs HTML - Link

Ogólny wzór składni na wstawienie linku wygląda następująco:

<a href="adres">widoczny tekst</a>

Przykładowo przy użyciu składni:

<a href="http://dodatki.net">Dodatki na bloga</a>

Otrzymamy następujący efekt:

Dodatki na bloga

Wyciągając wnioski z powyższego przykładu widzimy, że w miejscu adres został umieszczony adres strony (tzw. URL), do którego odsyła link. Natomiast w przypadku widoczny tekst widzimy, że w tym miejscu umieszczamy komunikat, który będzie wyświetlany na stronie/blogu.

Bardzo częstym błędym jest nieumieszczenie na początku adresu fragmentu http://. Zastanówmy się dlaczego? Adres musi mieć pełny format (tzn. zaczynający się od http://) w przypadku, gdy link odsyła do innej, zewnętrznej strony. Gdy wszystko odbywa się w obrębie jednej strony nie musimy za każdym razem używać pełnego formatu adresu. Wyobraź sobie, że http://dodatki.net jest folderem, w którym mogą zostać umieszczone pliki. Obecnie znajdujesz się na stronie http://dodatki.net/kurs_link.php, czyli jakby w pliku zawartym w głównym folderze. W takim przypadku wystarczy na stronie głównej umieścić link wnastępującej postaci:

<a href="kurs_link.php">Link</a>

Podobnie to wygląda w korelacji między plikami z jedego folderu. Także ze skróconego adresu możemy korzystać w przypadku folderów zawartych w obrębie jednej strony/bloga. Naszym folderem głównym jest http://dodatki.net i w tym folderze mamy umieszczony folder pomoc, a w folderze pomoc umiesczony jest plik index.php, którego pełny adres to http://dodatki.net/pomoc/index.php. W takim przypadku na stronie głównej wystarczy umieścić:

<a href="pomoc/index.php">Link</a>

Czasami chcemy, aby kliknięcie w link umieszczony na naszej stronie nie powodował wyścia z niej. Istnieje taka opcja, która po kliknięciu w link otworzy tą stronę w nowym oknie. jest ona warunkowana za pomocą parametru target="_blank". Musisz jednak pamiętać, że umieszczanie zbyt wielu takich linków może być uciążliwe dla odwiedzających Twoją stronę. Przykładowe zastosowanie target="_blank" pokazuje poniższy przykład:

<a href="http://dodatki.net" target="_blank">Dodatki na bloga</a>

Link będzie wyglądał identycznie, jednak będzie otwierał nowe okno:

Dodatki na bloga

Ostatnim punktem tego artykułu będzie pokazanie w jaki sposób należy umieszczać obrazek z odnośnikiem. Na początku jednak zapoznaj się z artykułem dotyczącym umieszczania obrazków. Metoda jest bardzo prosta - w miejscu, gdzie umieszczaliśmy wyświetlany tekst musimy umieścić obrazek. Przykładowo wstawiając:

<a href="http://dodatki.net" target="_blank"><img src="http://dodatki.net/img/button2.gif" border="0" alt="dodatki" /></a>

Otrzymamy następujący efekt:

dodatki

W kodzie przy obrazku dodaliśmy parametr border="0", dzięki któremu wokół obrazka nie pojawi się żadna dodatkowa ramka.

Strona główna

Polityka prywatności