Tytu│ pierwszego stopnia

<H1> </H1>

Przyk│ad:

To jest tytu│ pierwszego stopnia

Zwr≤µmy od razu uwagΩ na pewien atrybut, kt≤ry mo┐na wykorzystaµ w po│▒czeniu z tytu│em, akapitem czy niemal dowolnym innym elementem na stronie. Jest to atrybut TITLE, wy╢wietlaj▒cy "dymek" z informacj. Na razie interpretuje go Internet Explorer 4.

W poleceniu dodajemy TITLE="jaki╢ tam tekst", np.:

<H1 TITLE="Mn≤stwo ciekawych rzeczy do kupienia, koniecznie zobacz nasz katalog">Katalog Produkt≤w</H1>

Przesu± kursor myszki nad tytu│ - zobaczysz ciekawy efekt.

Katalog Produkt≤w

Tytu│ drugiego stopnia

<H2> </H2>

Przyk│ad:

To jest tytu│ drugiego stopnia

Tytu│ trzeciego stopnia

<H3> </H3>

Przyk│ad:

To jest tytu│ trzeciego stopnia

Tytu│ czwartego stopnia

<H4> </H4>

Przyk│ad:

To jest tytu│ czwartego stopnia

Tytu│ pi▒tego stopnia

<H5> </H5>

Przyk│ad:

To jest tytu│ pi▒tego stopnia

Tytu│ sz≤stego stopnia

<H6> </H6>

Przyk│ad:

To jest tytu│ sz≤stego stopnia

Wyr≤wnywanie tytu│≤w

<Hx ALIGN=CENTER> </Hx>

Przyk│ad:

To jest tytu│ na ╢rodku strony

<Hx ALIGN=RIGHT> </Hx>

To jest tytu│ justowany do prawego marginesu

<Hx ALIGN=LEFT> </Hx>

To jest tytu│ justowany do lewego marginesu

Znacznik akapitu

<P> </P>

Przyk│ad:

To jest nieco d│u┐szy akapit, kt≤ry powinien zaj▒µ wiΩcej ni┐ jeden wiersz, aby mo┐na by│o poprawnie zobrazowaµ stosowanie tego znacznika. No, chyba ju┐. Wiersz zosta│ przeniesiony.

To jest nastΩpny akapit, oddzielony od poprzedniego interlini▒. Ka┐dy akapit jest objΩty par▒ znacznik≤w.

Akapit mo┐na wyr≤wnaµ do lewego marginesu (domy╢lne ustawienie)

W ostatnich kilku-kilkunastu miesi▒cach │▒cza internetowe zapcha│y siΩ do granic wytrzyma│o╢ci, atakowane przez dziesi▒tki milion≤w spragnionych kontaktu ze ╢wiatem u┐ytkownik≤w. NajwiΩksze powody do narzeka± ma niew▒tpliwie ╢wiat nauki, kt≤ry utraci│ nagle uprzywilejowan▒ pozycjΩ, gdy "sklep za ┐≤│tymi firankami" zape│ni│ siΩ nagle t│umami zg│odnia│ych profan≤w.

... lub do prawego

W ostatnich kilku-kilkunastu miesi▒cach │▒cza internetowe zapcha│y siΩ do granic wytrzyma│o╢ci, atakowane przez dziesi▒tki milion≤w spragnionych kontaktu ze ╢wiatem u┐ytkownik≤w. NajwiΩksze powody do narzeka± ma niew▒tpliwie ╢wiat nauki, kt≤ry utraci│ nagle uprzywilejowan▒ pozycjΩ, gdy "sklep za ┐≤│tymi firankami" zape│ni│ siΩ nagle t│umami zg│odnia│ych profan≤w.

Mo┐na go te┐ ╢rodkowaµ

W ostatnich kilku-kilkunastu miesi▒cach │▒cza internetowe zapcha│y siΩ do granic wytrzyma│o╢ci, atakowane przez dziesi▒tki milion≤w spragnionych kontaktu ze ╢wiatem u┐ytkownik≤w. NajwiΩksze powody do narzeka± ma niew▒tpliwie ╢wiat nauki, kt≤ry utraci│ nagle uprzywilejowan▒ pozycjΩ, gdy "sklep za ┐≤│tymi firankami" zape│ni│ siΩ nagle t│umami zg│odnia│ych profan≤w.

Znacznik ko±ca wiersza

<BR>

Przyk│ad:

Pierwszy akapit, w kt≤rym zastosowali╢my przenoszenie wiersza. Uwaga, przenosimy...
NastΩpny wiersz tego samego akapitu, wpisywany po znaczniku <BR>, dziΩki kt≤remu zosta│ utworzony.

A teraz nastΩpny akapit, w kt≤rym zastosujemy...
ten sam manewr.
W taki spos≤b mo┐emy skracaµ wiersze akapitu i przenosiµ je ni┐ej, co bardzo siΩ przyda we wsp≤│czesnej poezji
pisanej
czΩsto
w s│upkach (taka moda)

Piµ
albo nie piµ,
oto jest pytanie...
a odpowiedzi udzieli Ci na nie
Pawe│ Wimmer

Znacznik ko±ca wiersza mo┐e byµ obecnie opatrywany dodatkowymi parametrami: CLEAR=LEFT, CLEAR=RIGHT i CLEAR=ALL. Parametry te s▒ wykorzystywane przy pozycjonowaniu grafiki i tekstu.

Gdy zastosujemy polecenie <IMG SRC="obrazek" ALIGN=LEFT>, obrazek zostanie ustawiony przy lewym marginesie strony, a znajduj▒cy siΩ za obrazkiem tekst bΩdzie ustawiany na tym samym poziomie.

U┐ycie parametru CLEAR pozwoli nam w odpowiednim momencie "zrzuciµ" tekst, poni┐ej grafiki. Na przyk│ad:

To jest strona ENTER-a

Analogiczne polecenie mo┐na zastosowaµ w przypadku obrazka przesuniΩtego w prawo (align=right), gdzie stosujemy <BR CLEAR=RIGHT>

To jest strona ENTER-a

Gdy na jednym poziomie na stronie znajduj▒ siΩ np. dwa obrazki i bΩdziemy chcieli "zrzuciµ" tekst poni┐ej ich poziomu, mo┐emy u┐yµ CLEAR=ALL.

Ten sam efekt uzyskaliby╢my, w tym konkretnym przypadku, stosuj▒c CLEAR=RIGHT, gdy┐ prawy obrazek jest wiΩkszy. U┐ycie CLEAR=LEFT przesunie tekst poni┐ej lewego obrazka, ale nie poni┐ej prawego. CLEAR=ALL jest o tyle lepsze, ┐e w pewnym momencie mogliby╢my zechcieµ zmieniµ wielko╢µ obu obrazk≤w (lewy wiΩkszy) i trzeba by pamiΩtaµ o zmianie parametru CLEAR.

Parametr CLEAR mo┐na r≤wnie┐ stosowaµ w ustawianiu tabel i tekstu, ale nie przy wykazach.

Pozioma linia

<HR>

Przyk│ad:

Linia mo┐e byµ pozbawiona cieniowania

Linii mo┐emy nadaµ dowoln▒ grubo╢µ

<HR SIZE=5>

Linia mo┐e mieµ okre╢lon▒ d│ugo╢µ w pikselach

<HR WIDTH=300>

lub w procencie szeroko╢ci strony

<HR WIDTH=50%>

Linia mo┐e byµ umieszczona na ╢rodku (domy╢lnie)

<HR ALIGN=center>

<HR ALIGN=center SIZE=8 WIDTH=200>

Mo┐e byµ justowana do lewego brzegu strony...

<HR ALIGN=left>

<HR ALIGN=left NOSHADE SIZE=4 WIDTH=300>

... lub do prawego

<HR ALIGN=right>

<HR ALIGN=right SIZE=3 WIDTH=400>

Jeszcze jednym uzupe│nieniem jest kolor poziomej linii, potocznie zwanej separatorem - jest to rozszerzenie Internet Explorera, nie wchodz▒ce jednak w sk│ad HTML 4. Zaleca siΩ raczej stosowanie styl≤w.

Polecenie:

w prosty spos≤b zmienia barwΩ separatora. Mo┐emy oczywi╢cie manipulowaµ szeroko╢ci▒ i d│ugo╢ci▒ linii.

Blok preformatowany

<PRE> </PRE>

Tekst preformatowany, wy╢wietlany czcionk▒ monotypiczn▒ (o sta│ej szeroko╢ci znaku) 
pozwala     wprowadzaµ    dodatkowe    spacje,

	uwzglΩdnia tak┐e
		punkty tabulacji,
i znaki ko±ca akapitu.
a1	a2	a3	a4
b1	b2	b3	b4

Polecenie PRE jest zalecane zamiast przestarza│ych (nie istniej▒cych ju┐ w specyfikacji jΩzyka) konstrukcji LISTING, PLAINTEXT i XMP.

Blok cytowany

<BLOCKQUOTE> </BLOCKQUOTE>

Bloku cytowanego mo┐emy u┐yµ przy powo│ywaniu siΩ na jakie╢ ╝r≤d│o. Cytat jest wy╢wietlany z uwzglΩdnieniem tabulacji. Na przyk│ad:

Wydaje mi siΩ, ┐e wiersz ko±czy siΩ fragmentem

Soft you now, the fair Ophelia.
Nymph, in thy orisons,
be all my sins remembered.

Ale nie mam pewno╢ci.

Cytat w wierszu

Nowym poleceniem HTML jest kr≤tki cytat w ramach wiersza (in-line quote), wprowadzany za pomoc▒ <Q></Q>.

Polecenie ma automatycznie obejmowaµ cytowany tekst cudzys│owem, przy czym od definicji jΩzyka zale┐y spos≤b wy╢wietlania cudzys│owu. Na przyk│ad, dla jΩzyka angielskiego, zagnie┐d┐one polecenie:

John said, <Q lang="en">I saw Lucy at lunch, she says <Q lang="en">Mary wants you to get some ice cream on your way home.</Q> I think I will get some at Ben and Jerry's, on Gloucester Road.</Q>

powinno daµ w efekcie

John said, "I saw Lucy at lunch, she told me 'Mary wants you to get some ice cream on your way home.' I think I will get some at Ben and Jerry's, on Gloucester Road."

Jak widaµ, "zewnΩtrzne" Q tworzy cudzys│≤w " ", a "wewnΩtrzne" cudzys│≤w ' '.

»adna z przegl▒darek nie interpretuje tego polecenia (w przyk│adzie cudzys│owy zosta│y wprowadzone rΩcznie).

(przyk│ad pochodzi z HTML Reference Library)

Adres

Polecenie jest interpretowane jako kursywa i jest czΩsto stosowane w odniesieniu do bloku tekstu zawieraj▒cego imiΩ i nazwisko, adres pocztowy, adres poczty elektronicznej, np.:

ªrodkowanie

Polecenie s│u┐y do ╢rodkowania na stronie wskazanego elementu, np. tekst lub obrazka.

Komentarz

Polecenie pozwala wstawiaµ do dokumentu komentarz autora. Tre╢µ komentarza nie bΩdzie wy╢wietlana na ekranie, ale stanowi dodatkow▒ informacjΩ dla samego autora lub osoby czytaj▒cej, gdy zajrzy do ╝r≤d│a dokumentu. Na przyk│ad:

Wycinek dokumentu

Polecenie pozwala wydzieliµ wiΩkszy blok w dokumencie, np. fragment tekstu, grafikΩ czy wykaz (nawet kilka r≤┐nych element≤w jednocze╢nie), a nastΩpnie nadaµ mu jaki╢ rodzaj formatowania - ╢rodkowanie lub dosuniΩcie do prawego marginesu. DIV jest czΩsto stosowane przy definiowaniu styl≤w. Przyk│ad u┐ycia <DIV align=right>

Wykaz

• pierwszy punkt wykazu
• drugi punkt wykazu
• trzeci punkt wykazu

jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst, jaki╢ tam tekst.

Obramowanie

W specyfikacji HTML 4 pojawi│o siΩ polecenie FIELDSET, kt≤re tworzy obramowanie dla znajduj▒cego siΩ w jego ramach elementu. Interpretuje je na razie Internet Explorer 4.

<FIELDSET>jaki╢ tam element</FIELDSET>

Samo obramowanie mo┐na oczywi╢cie uzyskaµ za pomoc▒ styl≤w, wiΩc wprowadzanie nowego polecenia nie by│oby zasadne. Rzeczywisty efekt widzimy dopiero po po│▒czeniu go ze znacznikiem <LEGEND>.

<FIELDSET>
<LEGEND>Wykaz element≤w</LEGEND>
pierwszy element
drugi element
trzeci element
</FIELDSET>

A oto wynik:

Inny przyk│ad, zaczerpniΩty z HTML Reference Library

Blokada i wymuszenie prze│amania

Niekiedy zdarza siΩ, ┐e jaki╢ tekst powinien byµ wy╢wietlany w jednym wierszu. Aby zapobiec prze│amaniu wiersza, mo┐emy obj▒µ tekst poleceniem <NOBR> </NOBR>.

Nale┐y je stosowaµ ostro┐nie, gdy┐ przegl▒darka jest wtedy zmuszona do sztucznego poszerzania okna. Gdyby tekst by│ d│ugi, u┐ytkownik by│by zmuszony do k│opotliwego przewijania okna wszerz, aby przeczytaµ ca│▒ zawarto╢µ wiersza.

ProszΩ zwr≤ciµ uwagΩ na dolny suwak przegl▒darki.

Razem z <NOBR> stosuje siΩ niekiedy wymuszenie prze│amania wiersza, za pomoc▒ <WBR> - Word Break. Wstawienie polecenia spowoduje prze│amanie wiersza, tj. przeniesienie wyrazu za poleceniem i nastΩpuj▒cego po nim tekstu o jeden wiersz. W dalszym ci▒gu jednak ca│o╢µ jest objΩta dzia│aniem <NOBR>.

tego wiersza nie wolno prze│amaµ, tego wiersza nie wolno prze│amaµ, tego wiersza nie wolno prze│amaµ, tego wiersza nie wolno prze│amaµ, tego wiersza nie wolno prze│amaµ, a jednak go prze│amali╢my, ale dalej tego wiersza nie wolno prze│amaµ, tego wiersza nie wolno prze│amaµ, tego wiersza nie wolno prze│amaµ

WBR i NOBR s▒ poleceniami przestarza│ymi, nie wchodz▒cymi w sk│ad HTML 4, aczkolwiek obs│uguj▒ je ci▒gle Navigator i Internet Explorer.

Pisanie w szpaltach

Wprowadzonym przez Netscape Communications poleceniem (nie uwzglΩdnionym w specyfikacji HTML 4) jest <MULTICOL> </MULTICOL>, kt≤re pozwala redagowaµ blok tekstu w szpaltach. Jak na razie, polecenie jest interpretowane przez Navigatora 3 i 4.

Jedynym obowi▒zkowym parametrem polecenia jest liczba szpalt. Wprowadzamy j▒ za pomoc▒ polecenia:

Parametr GUTTER, podawany w pikselach, okre╢la odstΩp miΩdzy szpaltami.

Parametr WIDTH, podawany w pikselach lub procencie szeroko╢ci okna, okre╢la szeroko╢µ, jak▒ zajmuj▒ szpalty.

Pusta przestrze±

Netscape Communications wprowadzi│a w najnowszej wersji Navigatora interpretacjΩ polecenia <SPACER>, kt≤re wstawia pust▒ przestrze± w danym miejscu strony (polecenie nie jest czΩ╢ci▒ HTML 4).

Polecenie zawiera kilka parametr≤w, kt≤re precyzuj▒ jego dzia│anie:

TYPE=horizontal (vertical, block) okre╢la, czy wolna przestrze± jest wstawiana poziomo, pionowo czy te┐ w postaci bloku.

SIZE=warto╢µ_w_pikselach (dotyczy wersji poziomej lub pionowej)

WIDTH= warto╢µ_w_pikselach (dotyczy bloku)

HEIGHT=warto╢µ_w_pikselach (dotyczy bloku)

ALIGN=left (center, right) - wyr≤wnanie bloku do lewego marginesu, ╢rodkowanie bloku lub dosuniΩcie bloku do prawego marginesu.

Przyk│adowo, polecenie <SPACER TYPE="horizontal" SIZE=100> wprowadzi w danym miejscu wiersza 100-punktowy odstΩp.

A to jest przyk│ad.

<SPACER TYPE="vertical" SIZE=50> pozwoli np. oddzieliµ od siebie dwa bloki tekstu o 50 punkt≤w w pionie.

<SPACER TYPE="block" HEIGHT=50 WIDTH=100 ALIGN=LEFT> wprowadzi pusty blok przy lewym marginesie.