[ aktualizacja 24.12.2000 ]

Uprzedzając opis sposobów wprowadzania stylów do dokumentu, założymy w tym miejscu, że posługujemy się stylami lokalnymi (in-line) tworzonymi za pomocą konstrukcji:

<p style="definicja stylu">Treść akapitu</p>

### Rodzina czcionek (font-family)

Aby zdefiniować rodzinę czcionek, należy wpisać w definicji stylu font-family: czcionka. Gdybyśmy sobie zażyczyli, aby akapit był wyświetlany za pomocą czcionki Times, powinniśmy napisać

<p style="font-family: Times">Treść akapitu</p>

Efekt będzie następujący:

To jest akapit napisany za pomocą czcionki Times

Analogicznie, możemy podać czcionkę Courier:

To jest akapit napisany za pomocą czcionki Courier

Ponieważ nigdy nie wiemy, jakimi czcionkami dysponuje czytelnik strony, możemy się zabezpieczyć, podając kilka kolejnych czcionek, np:

<p style="font-family: Times, 'Times New Roman', 'Times New Roman CE'">Treść akapitu</p>

To jest akapit wyświetlony za pomocą pierwszej dostępnej czcionki.

Proszę zwrócić uwagę, że gdy podajemy kilka czcionek, rozdzielamy je przecinkami i spacją. Gdy czcionka ma kilka wyrazów w nazwie, ujmujemy je w apostrof ', podczas gdy cała definicja jest objęta cudzysłowem.

Możemy także poslużyć się nazwą rodzajową, np. serif, co jeszcze bardziej zwiększa szansę, że akapit zostanie wyświetlony czcionką szeryfową, gdyby zabrakło w systemie czytelnika czcionek Times, Times New Roman itd..

<p style="font-family: serif">Treść akapitu</p>

To jest akapit wyświetlony za pomocą pierwszej dostępnej czcionki szeryfowej.

Możemy wykorzystywać także inne nazwy rodzajowe, np. sans-serif, cursive, fantasy, monospace. A oto przykłady (niektóre wyświetlane z błędami):

To jest akapit wyświetlony za pomocą pierwszej dostępnej czcionki bezszeryfowej.

To jest akapit wyświetlony za pomocą pierwszej dostępnej czcionki pochyłej.

To jest akapit wyświetlony za pomocą pierwszej dostępnej czcionki ozdobnej.

To jest akapit wyświetlony za pomocą pierwszej dostępnej czcionki monotypicznej.

Wynik wyświetlania może być odmienny w każdym konkretnym przypadku i nie jestem w stanie przewidzieć, jaka konkretna czcionka jest u Państwa angażowana do wyświetlania. Znam tylko jej nazwę rodzajową.

Oczywiście można mieszać definicje, podając nazwy imienne i rodzajowe, np. "Times, 'Times New Roman', serif".

Interpretacja: Internet Explorer, Netscape 6, Opera 5

Naturalnie, zagnieżdżając definicje w nagłówku HEAD, możemy rozbudować system klas, tworząc jakiś dominujący styl dla zwykłych akapitów oraz kilka stylów z klasami dla szczególnych przypadków, jak akapity zawierające przypisy, istotne uwagi itd. Rzecz jasna, możemy korzystać jednocześnie i ze stylów zagnieżdżonych, i z lokalnych, a nawet ze stylów zewnętrznych, zawartych na innych stronach. Opisujemy to w rozdziałach poświęconych klasom i wstawianiu stylów. Należy też pamiętać o zasadach pierwszeństwa obowiązujących w takiej kaskadzie stylów.

W specyfikacji stylów CSS2 pojawiły się też nazwy fontów systemowych, które można wykorzystywać w definicjach czcionek. Fonty systemowe mogą odmiennie wyglądać w różnych systemach operacyjnych.

akapit z czcionką caption

akapit z czcionką icon

akapit z czcionką menu

akapit z czcionką message-box

akapit z czcionką small-caption

akapit z czcionką menu-bar

Nawiasem mówiąc...

Nawiasem mówiąc, akapit wyświetlany za pomocą czcionki systemowej menu wygląda całkiem elegancko, co właśnie prezentuje tych kilka słów. Można jej użyć na przykład do publikowania jakichś krótkich wiadomości.

Interpretacja: Internet Explorer, Netscape 6, Opera 7