Page 81 - informatyka 8

4. Pracując w parach, umieśćcie odpowiednio dobrane tematycznie zdjęcie ze swojej kolekcji lub wybierzcie je z bez-
płatnego serwisu, np. pixabay.com (postępujcie zgodnie z zasadami prawa autorskiego). Dołączcie hiperłącze tury-
stycznego serwisu internetowego, którego odnośnikiem będzie zdjęcie. Potem dodajcie do nazw miejscowości, któ-
re odwiedziliście podczas wycieczek, hiperłącza oficjalnych serwisów internetowych tych miejscowości. Odświeżcie
edytowaną stronę i sprawdźcie działanie linków.

Krok po kroku

Aby wstawić zdjęcie na stronę WWW:

O O nadaj plikowi ze zdjęciem nazwę (bez użycia znaków diakrytycznych, wielkich liter i spacji), np. gory,
O O utwórz folder i umieść w nim plik tekstowy ze stroną główną (index.html) oraz plik ze zdjęciem,
O O w pliku index.html wpisz znacznik <img> (umożliwiający wstawienie zdjęcia) z atrybutem src (określającym ścieżkę
dostępu do pliku) <img src =”gory.png”> 1 , napisz w cudzysłowie nazwę pliku i jego rozszerzenie,
O O do znacznika img dodaj atrybut title, dzięki któremu zostanie wyświetlony tytuł zdjęcia, kiedy najedziemy na niego kurso-
rem <img src=”gory.png” title=”Tatry”> 2 ,
O O zapisz plik HTML i odśwież stronę, aby sprawdzić, jak wyglądają wprowadzone zmiany.

1
2

`

Aby dodać hiperłącza do strony WWW:

O O dodaj link do zdjęcia 3 , czyli przed jego tytułem wpisz znacznik <a> (tworzący link) z atrybutem href (link otworzy się
w tej samej karcie przeglądarki) <a href="http://natatry.pl"><img src=”gory.png” title="Tatry"></a> 4 ,
O O dodaj link do nazwy miejscowości znajdującej się na liście numerowanej, w tym celu przed jej nazwą wpisz znacznik
<a> z atrybutem href, np. <a href="http://www.krakow.pl"> Kraków</a> 5 ,
O O zmodyfikuj wprowadzony link, dodając do znacznika <a> atrybut target z parametrem _blank (odpowiadający za
otwarcie linku w nowej karcie przeglądarki), np. <a href="http://www.krakow.pl" target=”_blank”>Kraków</a> 6 ,
O O w podobny sposób dodaj linki do pozostałych nazw miejscowości 7 .

3
4

5
6

7

79