&

& & &

(w przypadku wypunktowań, natomiast w przypadku list
numerowanych jest to znacznik
). Elementy listy oznaczane są znacznikiem
1. &
   
. Np.:



• Punkt pierwszy


• Punkt drugi



Uwaga! Jeśli w treści elementu listy (
2. &
) umieścimy kolejną listę uzyskamy listę
zagnieżdżoną (patrz przykład - ćwiczenie 3).
Zadanie 3. Odtworzyć bloki i listy
Przetestować przedstawione powyżej znaczniki bloków i list. Odtworzyć poniższy wydruk
strony .
Wyjustowany akapit tekstu. Wyjustowany akapit tekstu. Wyjustowany akapit tekstu. Wyjustowany akapit
tekstu. Wyjustowany akapit tekstu. Wyjustowany akapit tekstu. Wyjustowany akapit tekstu. Wyjustowany
akapit tekstu.
Akapit tekstu wyrównany do strony prawej.
Akapit tekstu wyrównany do środka.
1. Punkt pierwszy
1. Podpunkt pierwszy
2. Podpunkt drugi
" PP pierwszy
" PP drugi
" PP trzeci
3. Podpunkt trzeci
2. Punkt drugi
3. Punkt trzeci
" Podpunkt pierwszy
" Podpunkt drugi
1. PP pierwszy
2. PP drugi
" Podpunkt trzeci
4. Punkt czwarty
5. Punkt piąty
Tworzenie stron internetowych w oparciu o język HTML 8
Grafika
Grafiki i zdjęcia są podstawowym elementem stron internetowych. Aby umieścić grafikę na
stronie zastosować należy znacznik z odpowiednimi parametrami. Parametry
znacznika:
" src= ście\
ka  parametr wskazujący ścieżkę względną do miejsca na dysku, gdzie
znajduje się plik z grafiką
" width= wartość px  parametr określający szerokość grafiki.
" height= wartość px  parametr określający wyskokość grafiki.
" alt= tekst  parametr określający tekst alternatywny, który zostanie wyświetlony, gdy z
jakiegoś powodu grafika nie zostanie wyświetlona na stronie
" align= left lub right  parametr określa z której strony obrazek ma być opisany
tekstem
" border= wartość px - parametr określa grubość obramowania obrazka (szczególnie
przydatne, gdzy obrazek ma być łączem internetowym)
Pamiętać należy, iż ustalając niepoprawnie wartości szerokości i wysokości rysunku uzyskać
można niepożądany efekt nieproporcjonalnego rozciągnięcia zdjęcia.
Zadanie 4. Odtworzyć układ grafiki na stronie
Do wykonania tego ćwiczenia należy pobrać z Internetu dowolne zdjęcie o średnich
rozmiarach, a następnie odtworzyć poniższy wydruk strony .
Tworzenie stron internetowych w oparciu o język HTML 9
Tabele
Tabele ( & ) składają się z wierszy ( & ), a wiersze z komórek (
& ). Treść tabeli może znajdować się tylko w komórkach.
Najważniejsze parametry znacznika tabeli :
" Width= { px | % }  - szerokość tabeli podana w pikselach lub w względnej szerokości
ekranu.
" Border= px  grubość ramki tabeli
" Cellspacing= px  odległość pomiędzy komórkami
" Cellpadding= px  odległość zawartości komórki od krawędzi komórki
Najważniejsze parametry znacznika komórki

: " Align= { left | right | center }   poziome wyrównanie w komórce " Valign= { top | middle | bottom }   pionowe wyrównanie w komórce " Width= { px | % }  - szerokość komórki podana w pikselach lub w względnej szerokości tabeli. Tworzenie stron internetowych w oparciu o język HTML 10 Zadanie 5. Odwzorować tabelę Przetestować przedstawione powyżej znaczniki tabel. Odtworzyć poniższy wydruk strony . Głowna tabela ma szerokość 700px. Tabela wewnątrz komórki ma zdefiniowaną odległość zawartości komórki od jej krawędzi na wartość 20 px. A ącza (linki) A ącza internetowe zwane często potocznie linkami są jednym z najważniejszych elementów stron internetowych. A ącza służą do wywołania innej strony internetowej poprzez zdarzenie kliknięcia w łącze. A ącze definiuje się za pomocą znacznika & . Pomiędzy znacznikami wpisuje się treść, w jaką należy kliknąć, aby przejść do wywołanej strony. Stronę do jakiej chcemy przenieść użytkownika po zdarzeniu kliknięcia w łącze definiuje się w parametrze href= url lub ście\ ka wzdlędna znacznika . Przykładowo, gdy łącze umieszczone jest w dokumencie index.html, a prowadzić ma do dokumentu news.html, który znajduje się w tym samym katalogu co plik index.html znacznik będzie wyglądał następująco: Kliknij, aby zobaczyć news y Parametr target informuje przeglądarkę o tym, w którym oknie ma otworzyć nowy dokument. W przypadku wartości _self nowy dokument otwarty zostanie we własnym oknie, dla wartości _blank nowy dokument otwarty zostanie w nowym oknie. Nic nie stoi na przeszkodzie, aby otwierać nowy dokument w nowym oknie o nazwie własnej, np.: wyniki W takiej sytuacji dokument otworzy się w nowym oknie o wewnętrznej (nigdzie nie Tworzenie stron internetowych w oparciu o język HTML 11 widocznej) nazwie wyniki i gdy kolejny link wywołany zostanie z parametrem target= wyniki zostanie on otwarty w tym żądanym oknie. Możliwe jest także wykorzystanie znacznika łącza do otwarcia domyślnego w systemie programu pocztowego z wypełnionym adresem odbiorcy. Uzyskuje się to poprzez wpisanie zamiast ścieżki do dokumentu adresu e-mail z przedrostkiem mailto. Np. Napisz do mnie Zadanie 6. Stworzyć łącza Stworzyć trzy dokumenty HTML: index.html, news.html, kontakt.html. We wszystkich dokumentach wprowadzić przykładową treść. W każdym z dokumentów stworzyć łącza do wszystkich pozostałych dokumentów. A ącza umieścić w tabeli wg wzoru. Pływające ramki Pływające ramki pozwalają na umieszczenie w jednym dokumencie HTML innego dokumentu HTML. Okienko definiowane jest znacznikiem . Pomiędzy znaczniki iframe wpisuje się treść, która pojawi się w przeglądarce, która nie obsługuje pływających ramek. Najważniejsze parametry znacznika