R_06_07.PDF

Rozdział 6.

Więcej o formatowaniu

tekstu w HTML-u

W dwóch poprzednich rozdziałach zapoznałeś się z podstawami języka HTML, czyli

zasadniczymi elementami strony oraz hiperpołączeniami. Wyposażony w tę wiedzę

możesz przystąpić do lektury rozdziału 6, w którym dowiesz się, co jeszcze HTML ma

do zaoferowania w kwestii układu strony i formatowania tekstu. Są tu opisane pozostałe

znaczniki, które potrzebne są do konstruowania stron WWW, zaczynając od standardu

HTML 2.0, na wersji 4.0 kończąc, jak również niektóre znaczniki specyficzne dla

konkretnych przeglądarek.

Tak więc w poniższym rozdziale nauczysz się, jak:

określać wygląd czcionki (pogrubiona, kursywa, czcionka maszynowa),

wstawiać do tekstu znaki specjalne (znak praw autorskich, litery akcentowane itp.),

tworzyć tekst preformatowany (z zachowaniem spacji i tabulacji),

wyrównywać tekst do lewej, prawej i środkować go,

zmieniać rodzaj i rozmiar czcionki,

tworzyć inne elementy stron w HTML-u, jak, na przykład, linie poziome, adresy i cytaty.

Poza tym dowiesz się, czym różni się standard HTML-a od jego rozszerzeń i kiedy należy

korzystać z jednego, a kiedy z drugiego. Po przeczytaniu rozdziału utworzysz

przykładową stronę, która będzie zawierała większość z poznanych do te

j pory

znaczników.

Liczba znaczników i wszelkich opcji, przedstawionych w tym rozdziale, jest naprawdę

duża, możesz więc poczuć się nieco przytłoczony nadmiarem informacji. W żadnym

razie nie próbuj tego wszystkiego zapamiętać! Postaraj się tylko zorientowa

ć, jakie

możliwości daje HTML, a do szczegółów zawsze będziesz mógł powrócić później.

120

Część 2. Tworzenie prostej strony WWW

Style znaków

Dotychczas poznane znaczniki HTML, które dotyczyły akapitów, list i nagłówków,

odnosiły się do pewnego fragmentu tekstu traktowanego jako całość, powodowały

zmianę atrybutów czcionki, odległości pomiędzy liniami bądź wstawienie dodatkowego

znaku (listy wypunktowane). Style znaków to znaczniki funkcjonujące inaczej — służą

do zmiany wyglądu pojedynczych wyrazów czy nawet znaków, będących częściami

składowymi innych elementów HTML-a.

Do zmiany wyglądu zbioru znaków, znajdujących się w tekście, służą dwa rodzaje

znaczników: style logiczne i fizyczne.

Style logiczne

Znaczniki z grupy stylów logicznych określają, w jaki sposób dany fragment tekstu ma

zostać w dokumencie wykorzystany, a nie wyświetlony. Są one w zasadzie bardzo

podobne do znaczników akapitu czy nagłówków, nie wskazują bowiem konkretnie, w

jaki sposób tekst ma zostać sformatowany, ale jaka jest jego rola w dokumencie. Style

logiczne to, na przykład, definicje, fragmenty kodu bądź wyróżnione słowa

Znaczniki stylów logicznych określają rolę tekstu w dokumencie, a nie sposób jego

formatowania na ekranie.

W wypadku stylów logicznych rolę określenia tego, w jaki sposób tekst będzie

wyświetlony na ekranie bierze na siebie przeglądarka. Nie ma żadnej gwarancji, że tekst

objęty tymi znacznikami zawsze będzie wyświetlony kursywą czy pogrubiony (dlatego

też nie powinieneś bezgranicznie im ufać).

W HTML-u 4.0 stworzony został mechanizm poszerzający możliwości stylów fizycznych

i logicznych — tzw. Arkusze stylów. Za pomocą owych arkuszy autor strony będzie mógł

dokładniej określić sposób wyświetlania (np. rozmiar czy rodzaj czcionki) poszczególnych

elementów dokumentu lub nawet całych grup elementów (na przykład, list wypunktowanych).

Szczegółowy opis arkuszy stylów znajdziesz w rozdziałach 31. i 32.

Każdy z omawianych w tym punkcie znaczników składa się ze znacznika

początkowego oraz końcowego i ma wpływ na tekst, znajdujący się pomiędzy nimi. Oto

opis ośmiu znaczników stylów logicznych, zawartych w standardzie języka HTML.

Znacznik ten mówi, że tekst powinien być w jakiś sposób wyróżniony, czyli

sformatowany inaczej niż reszta dokumentu. W przeglądarkach graficznych zwykle

do tego celu wykorzystywana jest kursywa. Oto przyk

ład:

Mrówkojad jest najdziwniej wyglądającym

zwierzęciem,nieprawdaż?

Rozdział 6. Więcej o formatowaniu tekstu w HTML-u

121

Znaki objęte tym znacznikiem powinny być wyróżnione jeszcze wyraźniej, niż ma

to miejsce w wypadku . Większość przeglądarek wykorzystuje do tego celu

pogrubienie:

Skręć w lewo przy stacji

benzynowej

<CODE> Tekst objęty taką parą znaczników to fragment kodu (na przykład, programu lub po

prostu HTML-a) i powinien być wyświetlony czcionką o stałej szerokości znaku

(w graficznych przeglądarkach jest to Courier):

<CODE>#include "trans.h" </CODE>

<SAMP> Ten znacznik oznacza tekst przykładowy, który jest wyświetlany bardzo podobnie

do <CODE> :

URL tej strony, to SAMP>http://www.cern.ch/</SAMP>

<KBD> W tym wypadku chodzi o tekst, który powinien być wpisany przez użytkownika

z klawiatury (stąd nazwa znacznika, która jest skrótem od ang. keyboard — klawiatura):

Wprowadź następującą komendę:

<KBD>find . –name "prune" -print</KBD>

<VAR> Ten znacznik wskazuje nazwę zmiennej lub innego elementu, który powinien zostać

zastąpiony przez jakąś wartość. Z reguły jest wyświetlany kursywą lub podkreślony:

<CODE>chown </CODE><VAR>twoje_imie nazwa_pliku</VAR>

<DFN> Znacznik definicji. Jest on wykorzystywany do oznaczania słowa, które będzie lub

właśnie zostało zdefiniowane:

Style używane jak wyżej nazywamy

<DFN>stylami znaków</DFN>.

<CITE> Za pomocą tego znacznika oznacza się krótkie cytaty, na przykład:

Oberżyna jest znana ze swych właściwości do wywoływania ostrych

mdłości

<CITE> (Lemay, 1994)</CITE>

Wszystkie wymienione znaczniki, z wyjątkiem <DFN> , są zdefiniowane w standardzie HTML

2.0. <DFN> został dodany w wersji 3.2.

W HTML-u 4.0 wprowadzono dwa kolejne znaczniki stylów logicznych. Znaczniki te

są najbardziej przydatne w przeglądarkach dźwiękowych (czyli takich, które prezentują

strony WWW w formie dźwiękowej). Przeglądarki graficzne, takie jak Internet Explorer

oraz Netscape Navigator nie będą wyświetlały tych znaczników w inny sposób. Jednak,

gdy przeglądarka dźwiękowa przeanalizuje tekst umieszczony wewnątrz jednego z tych

dwóch znaczników, każda jego litera zostanie przeczytana indywidualnie, na przykład,

słowo LIS zostanie odczytane nie w normalny sposób, lecz jako L-I-S.

Oba te elementy wykorzystują oba znaczniki — otwierający i zamykający — i mają

wpływ na tekst umieszczony wewnątrz nich. Wymieniam je poniżej.

122

Część 2. Tworzenie prostej strony WWW

<ABBR> Ten znacznik oznacza skrót słowa; oto przykład jego zastosowania:

Zastosuj standardowe skróty oznaczające nazwy stanów

(takie jak <abbr>CA</abbr> oznaczający Kalifornię).

<ACRONYM> Podobny do znacznika <ABBR> , oznacza słowo utworzone z pierwszych liter kilku

innych słów, na przykład:

Największym polskim ubezpieczycielem jest

<acronym>PZU</acronym> (Powszechny Zakład Ubezpieczeń).

Zapamiętałeś już wszystkie znaczniki? Jeżeli tak, to bardzo dobrze, bowiem na końcu

rozdziału czeka Cię krótki sprawdzian. Poniższy fragment pokazuje, jak można prak-

tycznie wykorzystać znaczniki stylów logicznych na stronie WWW. Rysunek 6.1 poka-

zuje, jak wygląda rezultat wyświetlony w przeglądarce Internet Explorer.

Mrówkojad jest najdziwniej wyglądającym zwierzęciem,

nieprawdaż?

Skręć w prawo przy Wesołym Sklepie Dee

Dee

<code>#include "trans.h"</code>

URL tej strony to: <samp>http://www.cern.ch/</samp>

Wpisz następujące polecenie: <kbd>find . -name "prune" -

print</kbd>

<code>chown </code><var>nazwa_użytkownika</var>

Style których nazwy odpowiadają sposobowi ich użycia są określane

jako <dfn>style logiczne</dfn>.

Oberżyny mogą u niektórych osób powodować mdłości

<cite> (Lemay, 1994)</cite>.

Zastosuj standardowe skróty oznaczające nazwy stanów (takie jak

<abbr>CA</abbr> oznaczający Kalifornię).

Największym polskim ubezpieczycielem jest <acronym>PZU</acronym>

(Powszechny Zakład Ubezpieczeń).

Rysunek 6.1.

Wyniki wyświetlone

w przeglądarce

Internet Explorer

Rozdział 6. Więcej o formatowaniu tekstu w HTML-u

123

Style fizyczne

Obok stylów logicznych, opisanych w poprzednim punkcie, funkcjonuje także inna

grupa znaczników, które pozwalają na ściśle określoną zmianę wyglądu danego frag-

mentu tekstu (pogrubienie, kursywa, jednakowa szerokość liter). Znaczniki te noszą na-

zwę stylów fizycznych.

Style fizyczne określają sposób, w jaki tekst powinien zostać sformatowany (pogrubienie,

kursywa itp.).

Podobnie jak znaczniki stylów logicznych, tak i w tym przypadku każdy znacznik ma

swój początek i koniec. W standardzie HTML 2.0 zdefiniowano trzy znaczniki stylów

fizycznych:

Pogrubienie,

Kursywa,

<TT> Czcionka maszynowa (znaki o jednakowej szerokości).

W HTML-u 3.2 pojawiły się kolejne:

Podkreślenie (zarzucony w wersji 4.0),

<S> Przekreślenie (zarzucony w wersji 4.0),

<BIG> Czcionka większa od reszty tekstu,

Czcionka mniejsza od reszty tekstu,

indeks dolny,

indeks górny.

Korzystając z przedstawionych znaczników, szczególnie z tych dostępnych dopiero od

wersji HTML 3.2, musisz być świadom, że nie wszystkie przeglądarki będą potrafiły

sobie z nimi poradzić. Zastanów się, czy nie można sformatować tekstu w inny sposób,

czy też w ogóle pominąć formatowanie. Wprawdzie najnowsze wersje przeglądarek,

jak, na przykład, Netscape Navigator czy Internet Explorer radzą sobie w takich sytu-

acjach doskonale, ale całe mnóstwo użytkowników korzysta jeszcze ze starszych wersji,

które mogą zachować się w różny sposób. A już na pewno z częścią tych znaczników

nie poradzi sobie przeglądarka tekstowa, taka jak Lynx, bowiem w tym trybie wyświe-

tlenie pewnych rodzajów zapisu jest po prostu niemożliwe.

W takiej sytuacji Lynx będzie próbował obejść problem i w jakiś sposób wyróżni za-

znaczony tekst, ale może to prowadzić do nieoczekiwanych rezultatów.

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika: