Lekcje >> Podstawy HTML 5
Polimax

Drukarnia w Warszawie realizująca druk wizytówek, plakatów jak również fotoksiążki, fotoobrazy i fotokalendarze - z wysyłką na terenie całego kraju.

Odsyłacze obrazkowe

Skoro wiemy jak wykonać odsyłacz oraz wiemy jak wstawić do dokumentu obrazek nic nam nie przeszkadza, aby połączyć te dwa znaczniki, uzyskując odsyłacz obrazkowy.

  1. Odsyłacz: <a href="adres_docelowy" target="_blank">opis</a>.
  2. Obrazek: <img src="adres_obrazka" alt="tekst alternatywny" />.
  3. Odsyłacz obrazkowy: <a href="adres_docelowy" target="_blank"><img src="adres_obrazka" alt="tekst alternatywny" /></a>.

Odsyłacz obrazkowy powstał poprzez wklejenie kodu obrazka w miejsce opis odsyłacza. Należy tutaj nadmienić, że większe możliwości do tworzenia odsyłaczy graficznych daje zastosowanie stylów CSS gdzie obrazek występuje jako tło.

Ćwiczenie 2_4_4_1

Wykonać stronę z odsyłaczem obrazkowym do dokumentu plik_docelowy.html. Przypominam, ze plik ten stosowaliśmy podczas poprzenich zajęć Ten plik przekopiuj do folderu obecnego ćwiczenia. Wykorzystaj ten obrazek. Kod do wykonania tego zadania wygląda następująco:
Strzałka obok jest odsyłaczem obrazkowym <a href="plik_docelowy.html" target="_blank"><img src="arrow.png" alt="Adresy względne" />. Tak powinna wyglądać wykonana strona:

Sprawdź działanie odsyłacza obrazkowego.

Praca domowa

Wykonaj stronę z odsyłaczem obrazkowym. Obrazej ściągnij z Internetu. Adresem docelowym ma być strona organizacji W3C.


Jeżeli nie jesteś pewny, jak wykonane zadania zapisać na pendriwie, to zajrzyj do pierwszego ćwiczenia, w którym zostało to dokładnie wytłumaczone.