Temat 43. Tworzenie łączy hipertekstowych, podstron oraz innych elementów z wykorzystaniem języka HTML
Poniżej znajduje się fragment tematu. Z pełną wersją zapoznasz się w podręczniku Informatyka 1-3.
Wszelkie prawa zastrzeżone. Wszystkie treści na stronie dlaucznia.migra.pl chronione są prawami autorskimi. Dowiedz się więcej.
- Czym charakteryzuje się język znaczników HTML?
- Czym są hiperłącza?
1. Tworzenie łączy hipertekstowych
Przykład 1. Tworzenie hiperłączy
<a href="example.html">Dalej</a>
Po kliknięciu tekstu Dalej w oknie przeglądarki zostanie wyświetlona zawartość pliku index2.html.
Dalej <a href="https://www.gov.pl/web/edukacja" target="_blank">Ministerstwo Edukacji i Nauki</a>
Po kliknięciu tekstu Ministerstwo Edukacji i Nauki otworzy się nowe okno (nowa karta) przeglądarki, w którym zostanie wyświetlona strona Ministerstwa Edukacji Narodowej.
Ministerstwo Edukacji i Nauki <a href="example.html"><img src="rys.gif"></a>
Aktywowanie hiperłącza następuje poprzez kliknięcie rysunku rys.gif.
2. Tworzenie podstrony
Ćwiczenie 1. Tworzymy podstronę i dodajemy hiperłącze do strony głównej
- Utwórz w programie Notepad++ podstronę o wybranej wyspie, np. Lanzarote. Umieść na stronie w nagłówku tytuł, a pod nim trzy zdania opisujące wyspę (możesz utworzyć trzy akapity lub zastosować listę).
Pobierz lanzarote.html
- Zapisz podstronę w pliku pod nazwą lanzarote.html w folderze Strona.
- Na stronie głównej umieść hiperłącze na nazwie „Lanzarote”, prowadzące do podstrony lanzarote.html, a na podstronie – w lewym górnym rogu ikonę z linkiem powrotu do strony głównej.
Pobierz index.html
Pobierz home.jpg
- Zapisz obydwa pliki: stronę główną i podstronę. Odśwież stronę w przeglądarce. Sprawdź poprawność działania hiperłączy.
3. Wstawianie obrazów
Aby umieścić na stronie rysunek, należy zastosować znacznik <img src="
źródło_pliku">.
Znacznik ten nie ma postaci zamykającej.
Na przykład: <img src="zdjecie.jpg">
Ćwiczenie 2. Dodajemy obrazy do podstrony
4. Wstawianie tabel
Przykład 2. Tworzenie tabeli
Utworzymy tabelę składającą się z dwóch wierszy – każdy z dwóch komórek.
<tableborder="1">
<tr>
<td>Wiersz 1, komórka 1</td>
<td>Wiersz 1, komórka 2</td>
</tr>
<tr>
<td>Wiersz 2, komórka 1</td>
<td>Wiersz 2, komórka 2</td>
</tr>
</table>
| Wiersz 1, komórka 1 |
Wiersz 1, komórka 2 |
| Wiersz 2, komórka 1 |
Wiersz 2, komórka 2 |
Ćwiczenie 3. Dodajemy tabelę do podstrony
Wykonaj ćwiczenie zgodnie z treścią w podręczniku. Plik lanzarote.html zapisany w ćwiczeniu 2.
5. Stosowanie kolorów
Wielu elementom strony WWW można nadawać odrębne kolory. Kolor można określić albo za pomocą angielskiej nazwy, albo podając jego wartość w systemie RGB.
Przykład 3. Stosowanie kolorów
<font color="red">czerwony tekst</font> czerwony tekst <font color="#ff0000">czerwony tekst</font> czerwony tekst
Ćwiczenie 4. Stosujemy kolory na stronie
Wykonaj ćwiczenie zgodnie z treścią w podręczniku. Plik index.html zapisany w ćwiczeniu 1.
Plik lanzarote.html zapisany w ćwiczeniu 3.
Przydatne linki
Program Notepad++
https://notepad-plus-plus.org/downloads/
Podziel się swoimi sugestiami do tego tematu
Cały czas się rozwijamy i zależy nam, aby treści dostosować do oczekiwań nauczycieli i uczniów. Masz sugestię do tego tematu? Napisz do nas:
Kto przetwarza moje dane?
Administratorem danych osobowych jest wydawnictwo Migra Sp. z o.o., ul. Świeradowska 51/57, 50-559 Wrocław (dalej „wydawnictwo”).
Powierzone dane są wykorzystywane wyłącznie dla potrzeb wydawnictwa i nie są udostępniane innym podmiotom w celach marketingowych.
Pewne dane mogą być przekazywane innym podmiotom (np. świadczącym usługi pocztowe lub kurierskie) w celu realizacji umowy.
Skąd wydawnictwo ma moje dane osobowe?
Zgodę na przetwarzanie danych wyraziłeś w czasie rejestracji na naszej stronie. Dane osobowe zostały przekazane przez Ciebie w czasie rejestracji lub w trakcie korzystania ze stron udostępnianych przez wydawnictwo.
W jakim celu wydawnictwo przetwarza moje dane osobowe?
Dane przetwarzane są w celu:
- świadczenia usług na stronie wydawnictwa (np. kalendarz nauczyciela, testy, multibooki, wersje demonstracyjne podręczników),
- zapewnienia stabilności pracy systemu (logi systemowe),
- kontaktu w sprawach dotyczących utrzymania konta lub realizacji bieżących zamówień.
Dodatkowo za Twoją zgodą dane przetwarzane są w celu:
- dostarczania zamówionych podręczników (w tym egzemplarzy bezpłatnych), materiałów edukacyjnych, materiałów ćwiczeniowych, poradników metodycznych lub innych materiałów,
- informowania o konferencjach i szkoleniach,
- informowania o produktach i promocjach.
Jak długo przechowywane są moje dane?
Dane osobowe przetwarzamy przez czas wykonywania usługi (posiadania przez Ciebie konta w systemie wydawnictwa), a także po jej zakończeniu w celu:
- obsługi reklamacji,
- zabezpieczania lub dochodzenia ewentualnych roszczeń,
- wypełnienia obowiązków wynikających z innych przepisów prawa, przede wszystkim przepisów podatkowych i rachunkowych.
Jakie mam prawa?
Masz prawo do:
- dostępu do treści swoich danych osobowych, uzyskania informacji czy i które dane są przetwarzane,
- poprawienia lub sprostowania danych,
- cofnięcia zgody na przetwarzanie Twoich danych, żądania ich usunięcia lub ograniczenia przetwarzania,
- otrzymania dostarczonych danych osobowych oraz przesłania ich do innego administratora,
- wniesienia skargi do organu nadzorczego w Rzeczpospolitej Polskiej lub organu nadzorczego w innym państwie Unii Europejskiej właściwym ze względu na miejsce zwykłego pobytu, swojego miejsca pracy lub miejsca popełnienia domniemanego naruszenia, jeżeli sądzisz, że przetwarzanie danych osobowych narusza postanowienia RODO*.
Z kim mogę się kontaktować w sprawie danych osobowych?
W sprawach związanych z danymi osobowymi możesz się kontaktować pod adresem: biuro@migra.pl.
Adres pocztowy: Migra Sp. z o.o., ul. Świeradowska 51/57, 50-559 Wrocław.
*) ROZPORZĄDZENIE PARLAMENTU EUROPEJSKIEGO I RADY (UE) 2016/679 z dnia 27 kwietnia 2016 r. w sprawie ochrony osób fizycznych w związku z przetwarzaniem danych osobowych i w sprawie swobodnego przepływu takich danych oraz uchylenia dyrektywy 95/46/WE (ogólne rozporządzenie o ochronie danych)
