R-04, ## Documents ##, HTML 4 - Czrna księga WebMastera


Rozdział 4.

Zaczynamy od podstaw

W poprzednich rozdziałach dowiedziałeś się, jak za pomocą World Wide Web zaplanować i zorganizować swoje witryny internetowe oraz dlaczego HTML jest niezbędny do tworzenia stron WWW. Utworzyłeś nawet swoją pierwszą stronę. Dziś dowiesz się więcej o każdym z podstawowych znaczników HTML oraz rozpoczniesz pisanie stron WWW zawierających nagłówki, paragrafy i różne rodzaje list. Rozdział ten poświęcony jest następującym tematom i znacznikom HTML, wyliczonym poniżej:

Struktura HTML-a

W HTML-u zdefiniowane są trzy znaczniki, które opisują ogólną strukturę strony oraz dostarczają podstawowych informacji nagłówkowych. Znaczniki te, <HTML>, <HEAD> oraz <BODY>, identyfikują stronę WWW w przeglądarkach lub w innych narzędziach HTML. Mogą także zawierać najistotniejsze informacje o stronie, na przykład, tytuł lub nazwisko autora. Znaczniki, opisujące strukturę strony, nie mają wpływu na jej wygląd w przeglądarce, istnieją tylko po to, aby pomóc przeglądarkom w przetwarzaniu plików HTML.

Zgodnie ze ścisłą definicją HTML-a, znaczniki te są opcjonalne, znaczy to, że ich brak nie uniemożliwia odczytania strony przez przeglądarkę. Znaczniki te są jednak wymagane w XHTML-u 1.0. Nie jest również wykluczone, że pojawią się narzędzia, które będą ich wymagały. Już teraz powinieneś wyrobić sobie nawyk stosowania znaczników określających strukturę strony.

Uwaga

Choć użycie znaczników struktury strony nie jest konieczne, proponowana specyfikacja XHTML 1.0 wymaga jednego dodatkowego elementu w kodzie strony WWW. Pierwsza linia każdej strony musi zawierać identyfikator DOCTYPE, określający wersję XHTML 1.0, z którą Twoja strona jest zgodna oraz definicję rodzaju dokumentu (DTD — Document Type Definition), która określa jego specyfikację. Następnie wprowadzasz znaczniki <HTML>, <HEAD> i <BODY>. W poniższym przykładzie, przed znacznikami struktury strony występuje określenie typu dokumentu XHTML 1.0 Strict:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/strict.dtd">

<html>

<head>

<title>Tytuł strony</title>

</head>

<body>

...treść Twojej strony...

</body>

</html>

W specyfikacji XHTML 1.0 określone zostały trzy rodzaje dokumentów HTML 4.0: Strict, Transitional oraz Frameset. Więcej informacji o znaczniku DOCTYPE znajdziesz w rozdziale 10. „XHTML i arkusze stylów”, natomiast informacje o dokumentach Strict, Transitional i Frameset odnajdziesz w rozdziale 24. „Projektowanie witryn do praktycznych zastosowań”.

Znacznik <HTML>

Pierwszym znacznikiem struktury, znajdującym się na każdej stronie jest <HTML>. Mówi on o tym, że zawartość odczytywanego właśnie pliku to kod, napisany w HTML-u. W proponowanej specyfikacji XHTML 1.0 znacznik <HTML> powinien zostać poprzedzony identyfikatorem DOCTYPE (o którym wspominałam w powyższej notatce), jak pokazałam w poniższym przykładzie.

Cała zawartość pliku, czyli treść i znaczniki powinny znajdować się pomiędzy początko­wym i końcowym znacznikiem <HTML>, tak jak w poniższym przykładzie:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/strict.dtd">
<html>
...twoja strona....
</html>

Znacznik <HEAD>

Para znaczników <HEAD> ... </HEAD> wyznacza nagłówek strony. W obrębie nagłówka znaj­duje się tylko kilka innych znaczników (najczęściej tytuł strony, opisany w dalszej części). W żadnym wypadku nie należy umieszczać w tym miejscu treści strony.

Oto typowy przykład poprawnego użycia znacznika <HEAD> (o znaczniku <TITLE> opowiem później):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<html><head><title>To jest Tytuł</title>

</head>

....

</head>

Znacznik <BODY>

Pozostała część strony (w poniższym przykładzie przedstawiona jako „.... treść strony ....”), znajduje się pomiędzy początko­wym i końcowym znacznikiem <BODY>. Cały kod, łącznie ze znacznikami <HTML> i <HEAD>, przedstawia się następująco:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<HTML><HEAD>

<TITLE>To jest Tytuł. Dalej znajdziesz więcej wyjaśnień</TITLE>

</HEAD>

<BODY>

.... treść strony ....

</BODY>

</HTML>

W powyższym przykładzie widać wyraźnie, że znaczniki HTML są w sobie nawzajem zag­nieżdżone. Obydwa znaczniki <BODY> i </BODY> znajdują się pomiędzy początkowym i koń­cowym znacznikiem <HTML>, podobnie sprawa ma się w przypadku znaczników <HEAD>. Wszystkie znaczniki HTML-a działają właśnie w ten sposób — formatują zagnieżdżone fragmenty tekstu. Musisz bardzo uważać, aby nie mylić kolejności znaczników, jak w po­niższym, błędnym przykładzie:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<HTML>

<HEAD>

<BODY>

</HEAD>

</BODY>

</HTML>

Za każdym razem, kiedy zamykasz znacznik, musisz upewnić się, że zamykasz ostatni, któ­ry został otwarty (więcej o zamykaniu znaczników dowiesz się w dalszej części tekstu).

Uwaga

W HTML 4.0 i wcześniejszych wersjach używanie niektórych znaczników zamykających nie jest konieczne. Użycie niektórych znaczników zamykających jest wręcz zabronione. W proponowanej specyfikacji XHTML 1.0 wszystkie znaczniki muszą być zamykane. Jak, gdzie i dlaczego używać znaczników zamykających, bardziej szczegółowo omówimy w rozdziale 10. „XHTML i arkusze stylów”. Jednakże już teraz przykłady demonstrowane w niniejszej książce pokazują właściwy sposób zamykania znaczników, tak aby starsze przeglądarki interpretowały poprawnie znaczniki zamykające XHTML 1.0.

Tytuł

Każda strona, napisana w HTML-u powinna posiadać tytuł. Z tego tytułu korzystają później przeglądarki i programy katalogujące strony WWW, umieszczając je na tworzonych przez siebie listach ulubionych stron. Do nadawania tytułu służy znacznik <TITLE>.

0x01 graphic

Tytuł określa temat, o którym traktuje strona WWW i on właśnie wyróżnia stronę na wszelkiego rodzaju listach czy wykazach ostatnio odwiedzanych miejsc. Poza tym, w wielu przeglądarkach graficznych, tytuł pojawia się na pasku tytułowym okna programu (m.in. Netscape i Microsoft Internet Explorer).

Znacznik <TITLE> znajduje się zawsze w obrębie nagłówka strony (znaczniki <HEAD>) i jego zadaniem jest skrótowe opisanie jej treści:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<HTML>

<HEAD>

<TITLE>Lew, Wiedźma i Garderoba</TITLE>

</HEAD>

<BODY>

.... treść strony ....

</BODY>

</HTML>

Strona może posiadać tylko jeden tytuł, który z kolei może zawierać tylko tekst, żadne inne znaczniki nie są dozwolone.

Wybierając tytuł, kieruj się tym, aby był on krótki oraz by możliwie jak najdokładniej opisy­wał treść strony. Musisz mieć na uwadze takich czytelników, którzy trafią na Twoją stronę zupełnie przypadkowo, korzystając z połączenia losowego lub czyjegoś spisu ulubionych stron. Tacy ludzie, którzy nie mają pojęcia, gdzie właściwie się znaleźli, powinni mieć możliwość natychmiastowego spostrzeżenia, o czym właściwie traktuje strona, która znalazła się przed ich oczami. Krótki, treściwy tytuł powinien bardzo im w tym pomóc. Z racji tego, że niektóre przeglądarki umieszczają tytuł strony na pasku tytułowym okna programu, jego długość może być ograniczona (tekst pomiędzy znacznikami <TITLE> może mieć dowolną długość, ale może zostać obcięty przez przeglądarkę przy wyświetla­niu). Poniżej przedstawiam kilka przykładów poprawnych tytułów:

<TITLE>Rośliny trujące Ameryki Północnej</TITLE>

<TITLE>Edycja obrazu: Przewodnik</TITLE>

<TITLE>Turystyczna oferta odwiedzin cmentarzy, lato 1998</TITLE>

<TITLE>Instalacja oprogramowania: Otwieranie płyty CD</TITLE>

<TITLE>Strona domowa Laury Lemay</TITLE>

A oto kilka tytułów, które są raczej niefortunne:

<TITLE>Część druga</TITLE>

<TITLE>Przykład</TITLE>

<TITLE>Zainteresowania Niguela Franklina</TITLE>

<TITLE>Niezapomniane chwile Drugiego Walnego Zebrania Czwartej Konferencji Komitetu Ochrony Angielskich Róż, dzień czwarty, po obiedzie</TITLE>

Na rysunku 4.1 przedstawiony został sposób, w jaki tytuł strony jest wyświetlany w przeglądarce Internet Explorer.

0x01 graphic

<TITLE>Rośliny trujące Ameryki Północnej</TITLE>

0x01 graphic

Rysunek 4.1

Wyniki wyświetlone w Internet Explorerze

0x01 graphic

Nagłówki

Nagłówki służą do podziału tekstu na części, tak jak książka dzielona jest na rozdziały (słowo „Nagłówki” napisane powyżej wytłuszczonym drukiem to właśnie nagłówek). W HTML-u zdefiniowanych jest sześć poziomów nagłówków. Znacznik nagłówka wygląda następująco:

<h1>Zakładanie zamka</h1>

Liczby określają poziom nagłówka (od H1 do H6). Nagłówki nie są numerowane podczas wyświetlania. Różnią się między sobą wielkością i atrybutami czcionki (pogrubienie, pod­kreślenie, wielkie litery) i w ten sposób odróżniają się od reszty tekstu.

O nagłówkach należy myśleć jak o elementach ogólnego planu strony. Jeżeli tekst posiada strukturę, właśnie nagłówki powinny stanowić jej odzwierciedlenie, tak jak pokazano w po­niższym przykładzie. (Zwróć uwagę na fakt, że tekst pod nagłówkami każdego kolejne­go poziomu został napisany z coraz większym wcięciem, co lepiej odzwierciedla jego struk­turę. Wcięcia te zostaną oczywiście zignorowane przez przeglądarkę.)

<h1>Mitologia na przestrzeni dziejów</h1>

<h2>Powszechne tematy mitologiczne</h2>

<h2>Najwcześniej znane mity</h2>

<h2>Źródła mitologii</h2>

<h3>Mitologia Mezopotamska</h3>

<h3>Mitologia Egipska</h3>

<h4>Opowieść o Izys i Ozyrysie</h4>

<h4>Horus i Set: Bitwa między Dobrem a Złem</h4>

<h4>Dwanaście godzin Świata Zmarłych</h4>

<h4>Rzeka Styks</h4>

<h2>Historia w mitach</h2>

W przeciwieństwie do tytułów, nagłówki mogą być dowolnie długie, mogą składać się z wielu linii tekstu (należy jednak pamiętać, że długi tekst, który jest w jakiś sposób wy­róż­niony, może być nieczytelny).

Częstą praktyką jest umieszczanie nagłówka najwyższego poziomu na samej górze strony, gdzie jego treść jest powieleniem tytułu lub tytułem sformułowanym nieco inaczej, bardziej skrótowo. Jeżeli strona zawiera kilka przykładów zakładek i jest częścią większej prezen­tacji na temat zakładek w ogóle, jej tytuł mógłby wyglądać następująco:

<title>Jak tworzyć zakładki: kilka przykładów</title>

Natomiast nagłówek najwyższego poziomu mógłby brzmieć:

<h1>Przykłady</h1>

Staraj się nie używać nagłówków, jeżeli pragniesz tylko wyróżnić w jakiś sposób fragment tekstu. Może to wyglądać znakomicie w przeglądarce, z której sam korzystasz, ale nigdy nie będziesz wiedział, co zobaczą inni czytelnicy Twojej strony. Być może, inne przeglądarki numerują nagłówki lub formatują je w jakiś inny, nietypowy sposób. Dodatkowym niebez­pieczeństwem jest fakt, że narzędzia tworzące indeksy do przeszukiwania zasobów sieci WWW korzystają z nagłówków, aby oznaczyć najważniejsze elementy strony. Uży­wając nagłówków do oznaczenia czegoś, co nagłówkiem nie jest, wprowadzasz je w błąd, co może przynieść nieoczekiwane rezultaty.

Poniższy przykład przedstawia kilka nagłówków. Rys. 4.2 przedstawia nagłówki w Internet Explorerze.

0x01 graphic

<h1>Mitologia na przestrzeni dziejów</h1>

<h2>Powszechne tematy mitologiczne</h2>

<h2>Najwcześniej znane mity</h2>

<h2>Źródła mitologii</h2>

<h3>Mitologia Mezopotamska</h3>

<h3>Mitologia Egipska</h3>

<h4>Opowieść o Izys i Ozyrysie</h4>

<h4>Horus i Set: Bitwa między Dobrem a Złem</h4>

<h4>Dwanaście godzin Świata Zmarłych</h4>

<h4>Rzeka Styks</h4>

<h2>Historia w mitach</h2>

0x01 graphic

Rysunek 4.2

Wyniki w Internet Explorerze

0x01 graphic

Akapity

Teraz, kiedy strona posiada już tytuł i nagłówki, można dopisać do niej trochę treści w postaci zwykłych akapitów.

W pierwszej wersji HTML-a znacznik <P> był zdefiniowany jako pojedynczy. Nie było czegoś takiego jak znacznik zamykający (</P>), a <P> oznaczał koniec, nie początek aka­pitu. Akapity w pierwszej wersji HTML-a wyglądały następująco:

Powoli i ostrożnie, Enigern zbliżył się do potężnego smoka.

Szelest pośród drzew pobliskiego lasu oderwał na chwilę jego uwagę,

śmiertelny błąd dzielnego rycerza.<p>

Smok rzucił się na niego, zionąc nagłym tchnieniem ognistego oddechu.

Kiedy smok wzniósł się ponad nim, Enigern padł na ziemię. Szybko

wyciągnął miecz i pchnął nim w pierś smoka.<p>

Większość przeglądarek zakładała, że aka­pity będą formatowane w ten właśnie sposób. Gdy te wczesne wersje przeglądarek odnajdywały znacznik <P>, przechodziły do nowej linii, która była trochę bardziej oddalona w pionie od poprzed­niej.

Sposób obsługi znacznika akapitu został zmieniony w specyfikacji HTML 4.0 (jak również w HTML 3.2 i 2.0) i oczywiście w kolejnych wersjach przeglądarek. W tej chwili znacznik <P> (<P>...</P>) jest podwójny, przy czym znacznik <P> oznacza odpowiednio początek akapitu. Poza tym, znacznik końca akapitu jest opcjonalny. Historia Enigerna wygląda teraz następująco:

<p>Powoli i ostrożnie, Enigern zbliżył się do potężnego smoka.

Szelest pośród drzew pobliskiego lasu oderwał na chwilę jego uwagę,

śmiertelny błąd dzielnego rycerza.</p>

<p>Smok rzucił się na niego, zionąc nagłym tchnieniem ognistego oddechu.

Kiedy smok wzniósł się ponad nim, Enigern padł na ziemię. Szybko
wyciągnął miecz i pchnął nim w pierś smoka.</p>

Dobrze jest wyrobić sobie przyzwyczajenie do używania znacznika <P> na początku każdego akapitu. Okaże się to szczególnie ważne, kiedy będziemy mówić o dosuwaniu tekstu do prawej i lewej strony czy też o jego centrowaniu. Starsze przeglądarki poprawnie przetwarzają tekst, sformatowany w taki sposób. Niegdyś stosowanie zamykającego znacznika </P> było opcjonalne, jednak w XHTML-u 1.0 sytuacja uległa zmianie, gdyż wszystkie znaczniki muszą być zamykane. W przykładach zawartych w tej książce będę go używała.

Niektórzy używają dodatkowych znaczników <P> pomiędzy akapitami, aby bardziej oddalić je od siebie. Przypominam ponownie naczelną zasadę: najważniejsza jest treść nie forma. Użytkownika tekstowej przeglądarki w żadnym wypadku nie zainteresuje dodatkowa linia, którą tak skrzętnie umieściłeś, a niektóre przeglądarki graficzne mogą potraktować kilka znaczników <P> jak jeden, burząc w ten sposób Twoją wizję strony.

Rysunek 4.3 przedstawia kolejny akapit tekstu o Enigernie i smoku wyświetlony w Internet Explorerze.

0x01 graphic

<p>Smok zwalił się na ziemię, jęcząc i wijąc się z bólu. Moc

miecza Enigerna okazała się śmiertelna, gdyż rychło smok wydał ostatnie

tchnienie. Teraz Enigern mógł bez przeszkód uwolnić Lady Aelfleadę

uwięzioną w smoczej jamie. </p>

0x01 graphic

Rysunek 4.3

Wygląd powyższego akapitu wyświetlonego w Internet Explorerze

0x01 graphic

Listy, listy i jeszcze raz listy

Najpowszechniej, oprócz nagłówków i akapitów, używanym elementem HTML-a są listy. Po przeczytaniu tego podpunktu będziesz nie tylko wiedział, jak tworzyć listy w HTML-u, ale będziesz potrafił stworzyć pięć różnych rodzajów list!

W HTML 4.0 zdefiniowane są trzy typy list:

Notatka

W specyfikacji HTML 4.0 znajdują się także listy uznane za przestarzałe: listy menu <MENU> i listy katalogu <DIR>. Powyższe dwa rodzaje list są raczej rzadko używane, a ich obsługa różni się w zależności od przeglądarki. Zamiast nich używaj raczej znaczników <UL> (lub listy wypunktowanej).

Nowy termin

Przestarzały znacznik lub atrybut to taki, który wciąż jest obsługiwany przez przeglądarki, jednak jego działanie można zastąpić, wykorzystując nowsze rozwiązania.

Notatka

Zwykle przeglądarki obsługują elementy uznane za przestarzałe, aby zachować kompatybilność ze starszymi standardami. Jeśli zakładasz, że część użytkowników przeglądających Twoje strony używać będzie przeglądarek zgodnych ze standardem HTML 3.2, takich jak Netscape Navigator 3 i Microsoft Internet Explorer 3 bądź ich wcześniejszych wersji, koniecznie musisz opanować również elementy przestarzałe. Ponieważ elementy te mogą okazać się przestarzałe w przyszłych wersjach HTML, kiedy to tylko możliwe, staraj się używać nowszych metod.

Notatka

W HTML 4.0 większość znaczników i atrybutów jest uznana za przestarzałe z powodu użycia arkuszy stylów (Cascading Style Sheet — CSS), które zostały szerzej omówione w rozdziale 10. „XHTML i arkusze stylów”.

Znaczniki list

Wszystkie znaczniki list posiadają następujące, wspólne elementy:

Notatka

Zamykanie znaczników <DD>, <DT> oraz <LI> nie jest obowiązkowe w HTML. Jednak, w ramach przygotowań do posługiwania się XHTML 1.0, używaj znaczników zamykających </DD>, </DD> i </LI>.

Znaczniki list mogą być ułożone w kodzie HTML w różnoraki sposób. Ja osobiście preferu­ję układ, w którym znaczniki list i wszystkie elementy znajdują się w osobnych liniach. Uk­ład ten jest bardzo przejrzysty, pozwala na łatwe odróżnienie od siebie pojedynczych ele­mentów oraz dodatkowo wyróżnia całą listę w strukturze strony. Inaczej mówiąc, uważam, że poniższy układ:

<P>Trylogia Sienkiewicza składa się z następujących części:</P>

<UL>

<LI>Ogniem i mieczem

<LI>Potop

<LI>Pan Wołodyjowski

</UL>

jest dużo czytelniejszy niż ten:

<P>Trylogia Sienkiewicza składa się z następujących części:</P>

<UL>

<LI>Ogniem i mieczem<LI>Potop<LI>Pan Wołodyjowski</UL>

choć obydwa fragmenty wyglądają identycznie w przeglądarce.

Listy numerowane

Listy numerowane są objęte znacznikami <OL>...</OL> (OL oznacza skrót od ang. Ordered List, lista uporządkowana), a każdy element listy rozpoczyna się od znacznika <LI> (ang. List Item, element listy).

Notatka

W HTML-u <LI> jest znacznikiem pojedynczym, nie trzeba stosować zamykającego znacznika </LI>, gdyż jest on opcjonalny. Pojawienie się kolejnego znacznika <LI> (lub zamykającego znacznika </OL> lub </UL>) oznacza koniec bieżącego elementu listy. Jednak, aby stworzyć poprawny dokument XHTML, kończenie elementów list znacznikiem </LI> jest konieczne.

Przeglądarka, wyświetlając elementy listy, numeruje je kolejno i wyświetla z odpowiednimi wcięciami. Nie musisz robić nic, co związane byłoby z nadawaniem numerów; całą pracę wykonuje przeglądarka. Jeżeli dodasz lub usuniesz jakiś element, przy następnym odczycie strony numeracja zostanie zaktualizowana.

0x01 graphic

Listy numerowane to listy, w których każdy element posiada swój numer.

List numerowanych powinieneś używać tylko wtedy, kiedy chcesz wyraźnie zaznaczyć, że kolejność elementów listy jest istotna. Doskonale nadają się one do tworzenia przepisów i innego rodzaju opisów czynności, które należy wykonywać w określonym porządku. Jeżeli pragniesz tylko wypisać składniki jakiejś większej całości, skorzystaj z listy wypunktowa­nej.

W poniższym przykładzie zastosowano listę numerowaną, zawierającą poszczególne kroki instalacji nowego systemu operacyjnego. W przykładzie pokazano zarówno źródłowy kod HTML, jak i wygląd strony w przeglądarce Internet Explorer na rysunku 4.4.

0x01 graphic

<p>Instalacja nowego systemu operacyjnego</p>

<ol>

<li>Włóż CD-ROM do stacji.</li>

<li>Wybierz URUCHOM.</li>

<li>Wprowadź literę stacji CD-ROM (przykładowo: D:\),

i SETUP.EXE.</li>

<li>Instaluj według kolejnych kroków programu istalacyjnego.</li>

<li>Po zainstalowaniu wszystkich plików zrestartuj komputer.</li>

<li>Módl się.</li>

</ol>

0x01 graphic

Rysunek 4.4

Netscape

0x01 graphic

Formatowanie list numerowanych w HTML 3.2

Listy numerowane w HTML-u 3.2 posiadają kilka atrybutów, za pomocą których możesz sterować sposo­bem wyświetlania listy przez przeglądarkę. Atrybuty te pozwalają, między innymi na wybór schematu numerowania, który zostanie wykorzystany do nadawania kolejnych numerów, pozwala też na określenie liczby, od której numeracja ma się rozpocząć (jeżeli nie chcesz zaczynać od 1). W HTML-u 4.0 atrybuty omawiane w tym podrozdziale zostały uznane za przestarzałe i zamiast nich należy stosować właściwości i wartości arkuszy stylów, spełniające analogiczną rolę. Niemniej jednak, aby zapewnić odpowiedni wygląd strony w przeglądarkach zgodnych ze standardem HTML 3.2, od czasu do czasu możesz zostać zmuszony do wykorzystania omawianych atrybutów.

0x01 graphic

Atrybuty to specjalne elementy znaczników, które zawierają dodatkowe opcje lub informacje o znacznikach.

Listy numerowane można dopasować do własnych potrzeb na dwa sposoby: można określić schemat numeracji oraz liczbę, od której ma się ona rozpocząć. W HTML-u 3.2 został zdefiniowany atrybut TYPE, który umożliwia wybór jednego z pięciu możliwych schematów numerowania:

Schemat numeracji zapisuje się wewnątrz znacznika <OL> w następujący sposób: <OL TYPE= "a">. W sytuacji, gdy atrybut TYPE nie zostanie określony, przyjmowana jest standar­dowa wartość "1".

0x01 graphic

Przeglądarki WWW mają tę zaletę, że ignorują atrybuty, których znaczenia nie znają. Oznacza to, że starsza przeglądarka, której obcy jest atrybut TYPE znacznika <OL>, napotkawszy go, po prostu go pominie.

Jako przykład rozpatrzmy następującą listę:

<p>Dni tygodnia w języku francuskim:</p>
<ol type="I">
<li>Lundi</li>
<li>Mardi</li>
<li>Mercredi</li>
<li>Jeudi</li>
<li>Vendredi</li>
<li>Samedi</li>
<li>Dimanche</li>

</ol>

Jeżeli dodałbyś do znacznika <OL> atrybut TYPE="I", lista ta, wyświetlona w Internet Explorerze wy­glądałaby jak na rys. 4.5.

0x01 graphic

<p>Dni tygodnia w języku francuskim:</p>
<ol type="I">
<li>Lundi</li>
<li>Mardi</li>
<li>Mercredi</li>
<li>Jeudi</li>
<li>Vendredi</li>
<li>Samedi</li>
<li>Dimanche</li>

</ol>

0x01 graphic

Rysunek 4.5

Wyniki w Internet Explorerze

0x01 graphic

Atrybut TYPE może być również stosowany w znaczniku <LI>. Wpływa on wtedy na zmianę schematu numeracji od pewnego miejsca listy, dotyczy bowiem elementu, w którym został użyty oraz wszystkich następnych.

Inny atrybut, START, pozwala na określenie, od jakiej liczby lub litery należy rozpocząć numerację. Standardowo przyjmowaną liczbą jest oczywiście 1, ale START pozwala na zmia­nę tej wartości. Tak więc <OL START="4"> spowoduje rozpoczęcie numeracji listy od liczby 4, natomiast <OL TYPE="a" START="3"> sprawi, że pierwszą literą listy numerowa­nej alfabetycz­nie będzie „c”, po niej nastąpi „d” itd.

Zmodyfikujmy więc poprzedni przykład, tak aby numeracja zaczynała się od piątej z kolei liczby alfabetu rzymskiego. Rezultat tej zmiany pokazany jest na rys. 4.6.

0x01 graphic

<ol type="I" start="7">
<li>Lipiec</li>
<li>Sierpień</li>
<li>Wrzesień</li>
<li>Październik</li>
<li>Listopad</li>
<li>Grudzień</li>
</ol>

0x01 graphic

Rysunek 4.6

Wyniki w Internet Explorerze

0x01 graphic

W przypadku atrybutu TYPE można było zmienić schemat numeracji od pewnego miejsca listy, analogicznie można postąpić z wartością. Do tego celu służy atrybut VALUE, który sprawia, że od miejsca, w którym został wstawiony, numeracja listy rozpoczyna się niejako od nowa, począwszy od podanej wartości.

Spróbujmy zastosować to do naszego przykładu. Załóżmy, że chcemy, aby trzy ostatnie składniki przepisu na sernik nosiły numery 10, 11 i 12, a nie 6, 7 i 8. Można to zrobić właśnie za pomocą atrybutu VALUE.

<P>Składniki sernika:</P>

<OL TYPE="I">

<LI>Twaróg

<LI>Miód

<LI>Kakao

<LI>Olejek waniliowy

<LI>Mąka

<LI VALUE=10>Jajka

<LI>Orzechy włoskie

<LI>Margaryna

</OL>

Listy wypunktowane

W listach wypunktowanych kolejność występowania elementów nie ma najmniejszego znaczenia. Z punktu widzenia HTML-a lista wypunktowana wygląda prawie tak samo jak lista numerowana, z tym, że ta pierwsza zawarta jest pomiędzy znacznikami <UL>-</UL>, a nie <OL>. Elementy listy oznaczone są znacznikiem <LI>, dokładnie tak jak w listach nu­merowanych.

Przeglądarki formatują listy wypunktowane w ten sposób, że przed każdym elementem wstawiają kropkę lub inny symbol, natomiast Lynx — przeglądarka tekstowa — wstawia w te miejsca gwiazdki (*).

0x01 graphic

W liście wypunktowanej elementy oznaczone są kropkami lub innymi symbolami.

Poniższy przykład pokazuje listę wypunktowaną. Rys. 4.7 przedstawia stronę wynikową w Internet Explorerze.

0x01 graphic

<p>Oto co lubię robić każdego ranka:</p>

<ul>

<li>Wypić filiżankę kawy</li>

<li>Oglądać wschód słońca</li>

<li>Słuchać śpiewu ptaszków</li>

<li>Słuchać szmeru liści pobliskich drzew</li>

<li>Przeklinać odgłosy pobliskiej budowy burzące pogodny nastrój</li>

</ul>

0x01 graphic

Rysunek 4.7

Netscape

0x01 graphic

Formatowanie list wypunktowanych w HTML-u 3.2

Postać list wypunktowanych, podobnie jak numerowanych, można modyfikować przy wykorzystaniu atrybutów HTML 3.2 (także one zostały uznane za przestarzałe w HTML-u 4.0). Większość przeglądarek (w tym Netscape oraz Internet Explorer) standar­dowo formatuje listy numerowane za pomocą kropek (przeglądarki tekstowe, jak, na przy­kład, Lynx, zwykle używają gwiazdek). Atrybut TYPE pozwala na zmianę tego symbolu w części przeglądarek. Zgodnie ze specyfikacją HTML 3.2. atrybut TYPE może przyjmować trzy następujące wartości:

W poniższym przykładzie zostały porównane trzy rodzaje list wypunktowanych. Rys. 4.8 przedstawia rezultat w Internet Explorerze.

0x01 graphic

<ul type="disc">

<li>DAT - Digital Audio Tapes</li>

<li>CD - Compact Discs</li>

<li>Kasety magnetofonowe</li>

</ul>

<ul type="square">

<li>DAT - Digital Audio Tapes</li>

<li>CD - Compact Discs</li>

<li>Kasety magnetofonowe</li>

</ul>

<ul type="circle">

<li>DAT - Digital Audio Tapes</li>

<li>CD - Compact Discs</li>

<li>Kasety magnetofonowe</li>

</ul>

0x01 graphic

Rysunek 4.8

Netscape dla Windows 95

0x01 graphic

Kolejnym podobieństwem do list numerowanych jest to, że można zmienić symbol wypun­ktowania, poczynając od dowolnego miejsca listy, dołączając atrybut TYPE do znacznika <LI>. Także ten atrybut w HTML-u 4.0 został uznany za przestarzały.

Listy definicji

Listy definicji różnią się nieznacznie od pozostałych. Każdy element listy składa się bowiem z dwóch, a nie jednej części:

Każda część elementu listy definicji posiada swój znacznik: <DT> oznacza pojęcie (skrót od ang. definition term), a <DD> definicję (skrót od ang. definition definition). Obydwa te zna­czniki są pojedyncze i występują zazwyczaj parami, chociaż większość przeglądarek radzi sobie bez problemów z samym pojęciem czy też samą definicją. Cała lista definicji objęta jest znacznikami <DL>…</DL> (skrót od ang. definition list).

0x01 graphic

W listach definicji każdy element składa się z dwóch części: pojęcia i definicji. Listy te zwane są czasem listami słownikowymi.

Poniżej pokazany jest przykład listy definicji, zawierającej krótki opis kilku ziół.

<dl>

<dt>Bazylia</dt>

<dd>Roślina jednoroczna. Osiąga wysokość czterech --> stóp[Author:MMP] , jej drobne białe kwiatki pachną bosko.</dd>

<dt>Oregano</dt>

<dd>Roślina wieloletnia. Wypuszcza dużo podziemnych pędów i trudno ją przesadzić w inne miejsce.</dd>

<dt>Kolendra</dt>

<dd>Roślina jednoroczna. Lubi łagodną aurę wiosny i jesieni.</dd>

</dl>

Przeglądarki formatują zazwyczaj listy definicji tak, że pojęcie i definicja znajdują się w osobnych liniach, a linia definicji jest dodatkowo przesunięta w prawo w stosunku do poprzedzającej ją linii pojęcia.

Zastosowanie tego typu list nie ogranicza się, oczywiście, tylko do objaśniania pojęć, może być ono bowiem znacznie szersze. Oto przykład:

<dl>

<dt>Żona</dt>

<dd>Byłam u ojca Beniamina, obiecał mi się na pojutrze.</dd>

<dt>Mąż</dt>

<dd>Dziękuję ci.</dd>

<dt>Żona</dt>

<dd>Posłałam do cukiernika, żeby kilka tort przysposobił, boś podobno dużo gości sprosił na chrzciny - wiesz - takie czekoladowe, z cyfrą Jerzego Stanisława.</dd>

<dt>Mąż</dt>

<dd>Dziękuję ci.</dd>

<dt>Żona</dt>

<dd>Bogu dzięki, że już raz się odbędzie ten obrządek - że Orcio nasz zupełnie chrześcijaninem się stanie - bo choć już chrzczony z wody, zdawało mi się zawsze, że mu nie dostaje czegoś.</dd>

</dl>

Poniższy przykład przedstawia, jak lista definicji formatowana jest przez Internet Explorera (patrz rys. 4.9).

0x01 graphic

<dl>

<dt>Bazylia</dt>

<dd>Roślina jednoroczna. Osiąga wysokość czterech --> stóp[Author:MMP] , jej drobne białe kwiatki pachną bosko.</dd>

<dt>Oregano</dt>

<dd>Roślina wieloletnia. Wypuszcza dużo podziemnych pędów i trudno ją przesadzić w inne miejsce.</dd>

<dt>Kolendra</dt>

<dd>Roślina jednoroczna. Lubi łagodną aurę wiosny i jesieni.</dd>

</dl>

0x01 graphic

Rysunek 4.9

Internet Explorer

0x01 graphic

Listy zagnieżdżone

Co stanie się, gdy wstawisz jedną listę wewnątrz drugiej? Zagnieżdżanie list w HTML-u działa bardzo sprawnie — wystarczy wstawić całą listę jako element innej. Lista zagnież­dżona w ten sposób staje się elementem listy macierzystej i jest wyświetlana z odpowiednim wcięciem. Jest to szczególnie dobry sposób na odzwierciedlenie struktur hierarchicznych, takich jak wszelkiego rodzaju spisy treści.

Pisanie kodu HTML z odpowiednimi wcięciami jest bardzo pożyteczne, pozwala bowiem na uzmysłowienie sobie związków poszczególnych elementów z właściwym układem na stronie:

<ol>

<ul>

<li>WWW</li>

<li>Organizacje</li>

<li>Nauka HTML</li>

<ul>

<li>Czym jest HTML</li>

<li>Jak, pisać w HTML'u</li>

<li>Struktura dokumentu</li>

<li>Nagłówki</li>

<li>Paragrafy</li>

<li>Komentarze</li>

</ul>

<li>Linki</li>

<li>Więcej o HTML</li>

</ol>

Wiele przeglądarek odróżnia listy zagnieżdżone i ich listy nadrzędne, formatując je w różny sposób. Może być to inny niż kropka symbol wypunktowania w liście zagnieżdżonej, czy też inny schemat numeracji (liczby w liście nadrzędnej, litery w liście zagnieżdżonej). Jednakże, nie możesz zakładać, że tak właśnie będzie i, na wszelki wypadek, nie umieszczaj w tekście odniesień typu „rozdział 8., podpunkt 8.”, nie możesz bowiem być pewien, że tak właśnie przeglądarka ponumeruje listę.

Poniższy przykład przedstawia, jak listy zagnieżdżone są formatowane przez Internet Explorera (rys. 4.10).

0x01 graphic

<h1>Rodzaje linii rysunkowych</h1>

<ul>

<li>Gruba</li>

<li>Cienka</li>

<ul>

<li>Ciągła</li>

<li>Kreskowa</li>

<li>Punktowa</li>

<li>Dwupunktowa</li>

<li>Falista</li>

</ul>

<li>Bardzo gruba</li>

</ul>

0x01 graphic

Rysunek 4.10

Wyniki wyświetlone w Internet Explorerze

0x01 graphic

Komentarze

Istnieje możliwość wstawiania komentarzy do kodu napisanego w języku HTML. Mogą one służyć opisowi elementów strony, mogą również w pewien sposób określać jej status. Tekst zawarty w komentarzach jest ignorowany przez przeglądarkę, co oznacza, że ich treść nigdy nie pojawia się na ekranie (w końcu dlatego nazywają się komentarzami). Składnia komen­tarza jest następująca:

<!-- To jest komentarz -->

Każda linia tekstu powinna posiadać odpowiadający jej komentarz. Nie powinieneś wsta­wiać w komentarzach żadnych innych znaczników HTML, może to bowiem kompletnie zmylić przeglądarkę, która nie wiedząc, na co właściwie natrafiła, może komentarz wyświetlić. Dobrze jest wobec tego przyjąć żelazną zasadę, aby nie używać w komenta­rzach znaków <, > i --.

Oto kilka przykładowych komentarzy:

<!-- W tej sekcji jest za dużo humoru -->

<!-- Stefan pomógł przy tej części -->

<!-- Naprzód Bobry! -->

Ćwiczenie 4.1. Tworzymy prawdziwą stronę HTML

0x08 graphic
W tym momencie wiesz już wystarczająco dużo, aby móc tworzyć pierwsze, proste strony HTML. Wiesz już, czym jest HTML, znasz kilka znaczników, próbowałeś nawet przeglą­dać plik HTML. Nie utworzyłeś jeszcze wprawdzie żadnego połączenia, ale dojdziemy i do tego już w następnym rozdziale.

W tym ćwiczeniu pragnę zademonstrować, jak stworzyć plik HTML wykorzystujący pozna­ne dotąd znaczniki. Pozwoli Ci to zrozumieć, jak poszczególne znaczniki są odzwiercie­dlane na sformatowanej stronie i jakie typowe pomyłki na Ciebie czyhają. Nikt nie jest nieomylny, dlatego też często edytory HTML, które wstawiają znaczniki za użytkownika okazują się bardzo pomocne. Edytor nigdy nie zapomni wstawić znacznika zamykającego, nie pominie ukośnika ani też nie popełni żadnego innego błędu w pisowni.

Spróbuj napisać swój pierwszy przykład w zwykłym edytorze. Tak naprawdę, nie musi on być zbyt skomplikowany, znajdą się w nim znaczniki struktury, kilka nagłówków i jeden, może dwa akapity. Mógłby on wyglądać następująco:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title>Profil Spółki, Camembert Sp. z o.o.</title>

</head>

<body>

<h1>Camembert Sp. z o.o.</h1>

<p>"Całymi nocami śniłem o serze -- najczęściej o tostach z serem."

-- Robert Louis Stevenson</p>

<h2>Co robimy</h2>

<p>Produkujemy ser. Mnóstwo sera; ponad osiem ton rocznie.</p>

<h2>Dlaczego?</h2>

<p>Ludzie, którzy lubią ser płacą nam mnóstwo forsy. Więc produkujemy więcej.</p>

<h2>Nasze ulubione sery</h2>

<ul>

<li>Brie</li>

<li>Havarti</li>

<li>Camembert</li>

<li>Mozzarella</li>

</ul>

</body>

</html>

Zapisz utworzony plik z rozszerzeniem .htm lub .html, otwórz go w przeglądarce i oceń, jak się prezentuje.

Jeżeli tylko dysponujesz inną przeglądarką, najlepiej na zupełnie innym komputerze, radzę obejrzeć ten plik również tam. Jeżeli uda Ci się to zrobić, zwróć baczną uwagę na różnice w wyglądzie strony. Możesz być bardzo zdziwiony, widząc, jak bardzo strona może się zmienić, gdy jest oglądana w innej przeglądarce.

Oto ilustracja, która przedstawia stronę producenta serów w Internet Explorerze (rys. 4.11). Czy teraz rozumiesz, co mam na myśli?

Rysunek 4.11

Strona producenta serów wyświetlona w Internet Explorerze

0x01 graphic

Podsumowanie

HTML to tekstowy język znaczników, używany do tworzenia hipertekstowych stron w sieci WWW, opisujący strukturę strony, a nie jej układ na ekranie.

W tym rozdziale nauczyłeś się, czym jest HTML oraz jak tworzyć i edytować proste strony WWW. Poza tym poznałeś następujące znaczniki HTML.

Tabela 3.1: Znaczniki HTML opisane w tym rozdziale

Znacznik

Atrybut

Opis

<HTML> ... </HTML>

Cała strona HTML.

<HEAD> ... </HEAD>

Nagłówek strony HTML.

<BODY> ... </BODY>

Treść strony HTML.

<TITLE> ... </TITLE>

Tytuł strony.

<H1> ... </H1>

Nagłówek pierwszego poziomu.

<H2> ... </H2>

Nagłówek drugiego poziomu.

<H3> ... </H3>

Nagłówek trzeciego poziomu.

<H4> ... </H4>

Nagłówek czwartego poziomu.

<H5> ... </H5>

Nagłówek piątego poziomu.

Znacznik

Atrybut

Opis

<H6> ... </H6>

Nagłówek szóstego poziomu.

<P> ... </P>

Akapit.

<OL> ... </OL>

Lista numerowana. Każdy element listy rozpoczyna się od znacznika <LI>.

TYPE

Określa schemat numerowania listy. Przestarzały w HTML 4.0.

START

Określa, od jakiej liczby ma się rozpo­cząć numeracja. Przestarzały w HTML 4.0.

<UL> ... </UL>

Lista wypunktowana. Każdy element listy rozpoczyna się od znacznika <LI>.

TYPE

Określa symbol używany do oznaczania pozycji na liście. Przestarzały w HTML 4.0

<MENU> ... </MENU>

Lista menu (lista niewielkich elementów lub akapitów).

<DIR> ... </DIR>

Lista szczególnie krótkich elementów (jedno-dwuwyrazowych). Listy tego typu nie są zbyt często wykorzystywane.

<LI> ... </LI>

Element listy numerowanej, wypunktowanej, menu lub katalogu. Znacznik zamykający jest opcjonalny w HTML-u, lecz wymagany w XHML-u 1.0.

TYPE

Powoduje zmianę schematu numerowania lub symbolu wypunktowania, po­cząwszy od elementu listy, w którym występuje. Można go stosować tylko w listach <UL> i <OL>. Przestarzały w HTML 4.0

VALUE

Powoduje rozpoczęcie numerowania od podanej wartości. Przestarzały w HTML 4.0

<DL> ... </DL>

Lista definicji. Jej elementy składają się z dwóch części: pojęcia i jego definicji.

<DT> ... </DT>

Pojęcie na liście definicji. Znacznik zamykający jest opcjonalny w HTML-u, lecz wymagany w XHML-u 1.0.

<DD> ... </DD>

Definicja pojęcia podanego po znaczniku <DT>. Znacznik zamykający jest opcjonalny w HTML-u, lecz wymagany w XHML-u 1.0.

<!-- ... -->

Komentarz.

Warsztat

Ponieważ w niniejszym rozdziale nauczyłeś się wielu nowych rzeczy, warsztaty pomogą Ci zapamiętać parę najważniejszych elementów. W pierwszej części postarałam się przewidzieć pytania, które mógłbyś mi zadać.

Pytania i odpowiedzi

P. Przeglądając kod źródłowy różnych stron WWW zauważyłem, że znaczniki struktury strony (<HTML>, <HEAD>, <BODY>) nie są zbyt często używane. Czy wobec tego są one naprawdę potrzebne, skoro bez nich strony wyglądają całkiem dobrze?

  1. Większość przeglądarek będzie poprawnie wyświetlać strony WWW zawierające sam kod HTML bez znaczników struktury strony. Gdy jednak przejdziemy do XHTML, gdzie znaczniki te są wymagane, koniecznie trzeba będzie umieszczać je w kodzie tworzonych stron. A zatem, wyrobienie sobie nawyku stosowania tych znaczników już teraz jest dobrym pomysłem. Stosowanie znaczników struktury strony już teraz sprawi, że Twoje strony WWW będą mogły być czytane przez większą ilość ogólnych narzędzi SGML oraz umożliwi wykorzystanie możliwości przeglądarek, które pojawią się w przyszłości. Poza tym, stosowanie tych znaczników jest „poprawne”, jeśli zależy Ci na tym, aby Twoje strony były zgodne ze specyfikacją HTML.

P. Coś jest nie jest w porządku z listą definicji, którą utworzyłem. Pojęcia są wyświetlane z większym wcięciem niż definicje!

O. Nie pomieszałeś przypadkiem ze sobą znaczników <DD> i <DT>? Znacznik <DT> (poję­cie) powinien znajdować się zawsze przed <DD> (definicja). Ja często mylę je ze sobą. Za dużo w tym wszystkim litery D.

P. Widziałem w jednym z plików HTML znacznik <LI>, znajdujący się poza jakąkol­wiek listą, wstawiony zupełnie luzem, w pewnym miejscu strony:

<LI>I wtedy powiedział: „zapisz to na mój rachunek”</LI>

  1. Większość przeglądarek powinna zaakceptować tego typu zapis i wyświetlić go w for­mie zwykłego akapitu lub pojedynczego punktu bez wcięcia. Jednakże, z punktu widze­nia specyfikacji języka HTML, takie użycie znacznika <LI> jest błędem, tak więc nie powinno się to zdarzać na „dobrych” stronach. A ponieważ bardzo chciałabym, aby stro­ny, które będziesz tworzył po przeczytaniu tej książki były naprawdę dobre, stanowczo nie polecam stosowania tego typu zapisu. Element listy powinien zawsze znajdować się na swoim miejscu, czyli wewnątrz niej.

  2. Wspomniałaś, że niektóre znaczniki list i atrybuty są przestarzałe w HTML 4.0. Jak mogę je zastąpić?

  1. Zależy to od użytkowników odwiedzających Twoje strony. Przykładowo, jeśli Twoje strony znajdują się w sieci wewnętrznej przedsiębiorstwa, kiedy jesteś pewien, że każdy używa przeglądarki zgodnej z HTML 4.0 obsługującej arkusze stylów (CSS), zamiast zdeprecjonowanych znaczników możesz skorzystać z właściwości arkuszy stylów CSS. Jeśli jednak Twoja strona znajduje się w Internecie, gdzie wszyscy używają różnych przeglądarek i platform sprzętowych, korzystniejsze będzie użycie zdeprecjonowanych znaczników, aby Twoje strony były poprawnie wyświetlane również w starszych typach przeglądarek. Zalety i wady obydwu rozwiązań oraz przykłady zastępowania przestarzałych znaczników zostały przedstawione w rozdziale 24.

Quiz

1. Które trzy znaczniki HTML służą do określania ogólnej struktury strony WWW i jaka jest rola każdego z nich?

2. Jakie jest działanie znacznika <TITLE> i w jakim celu jest używany?

3. Ile różnych rodzajów nagłówków jest używanych w HTML? Jakie są ich znaczniki?

4. Dlaczego warto używać znacznika zamykającego paragraf </P>, mimo że jego użycie nie jest wymagane?

5. Które dwa rodzaje list są już zdeprecjonowane? Jak można je zastąpić?

Odpowiedzi

1. Znacznik <HTML> wskazuje, że dokument został napisany w języku HTML. Znacznik <HEAD> wskazuje, że tekst pomiędzy parą znaczników jest wprowadzeniem do reszty dokumentu. Znacznik <BODY --> [Author:MMP] > zawiera pozostałą część strony HTML (tekst, połączenia, obrazki, itd.).

2. Znacznik <TITLE> zawiera tytuł strony wyświetlany w pasku tytułowym przeglądarki oraz zapamiętywany przez wyszukiwarkę internetową. Znacznik ten zawsze znajduje się wewnątrz pary znaczników <HEAD>.

3. W HTML jest używanych sześć różnych rodzajów nagłówków. Nagłówki są zawarte między znacznikami od <H1 ... /H1> do <H6 ... /H6>.

4. Użycie znacznika zamykającego </p> nabiera istotnego znaczenia w momencie, gdy tekst jest wyrównywany do lewej strony, do prawej, bądź wyśrodkowany. Konieczne jest również użycie znacznika zamykającego w XHTML 1.0.

5. Rodzaje list <MENU> oraz <DIR> stały się już zdeprecjonowane, na korzyść użycia list wypunktowanych lub nieuporządkowanych, <UL>.

Ćwiczenia

1. Wzorując się na stronie Camembert Incorporated, utwórz stronę zwięźle omawiającą tematy, które chciałbyś poruszyć na łamach swojej strony. W następnym rozdziale, za pomocą tej strony nauczysz się, jak tworzyć połączenia (ang. link).

2. Utwórz następną stronę, rozwijając jeden z tematów ze strony utworzonej w poprzednim ćwiczeniu. Na stronie wstaw kilka nagłówków (na przykład, takich jak na rysunku 4.2). Możesz także uzupełnić treść strony oraz dodać parę list, w miejscach do tego odpowiednich. Ćwiczenie to także pomoże Ci przygotować się do materiału prezentowanego w następnym rozdziale.

102

HTML 4 - Vademecum profesjonalisty

103

Zaczynamy od podstaw

może trzeba to - dla polskiego Czytelnika - przełożyć na metry lub centymetry?

jak wyżej

czy taka czcionka dla znacznika?

3


Wyszukiwarka