Klasy

Klasy to elementy znakomicie rozszerzaj▒ce mo┐liwo╢ci dzia│ania webmastera. Gdyby kto╢ zapyta│, jak zr≤┐nicowaµ te same fizyczne elementy w odmiennych sytuacjach (np. odmienne czcionki w r≤┐nych akapitach), odpowied╝ jest prosta - klasy ca│kowicie uniezale┐niaj▒ od jakichkolwiek ogranicze±. Mo┐emy sobie przygotowaµ np. kilka r≤┐nych klas akapit≤w, jak P.normalny, P.przypisy, P.uwagi, P.istotne itd. Przywo│uj▒c odmienne klasy, uzyskujemy ┐▒dane formatowanie dokumentu. Pierwotnych polece± jΩzyka nie jest wiele, ale klasy mo┐emy tworzyµ w dowolny spos≤b, zwielokrotniaj▒c swoje mo┐liwo╢ci. Ma│o tego - w r≤┐nych arkuszach mo┐emy tworzyµ klasy o tych samych nazwach, ale definiowaµ je odmiennie, wskutek czego zyskujemy jeszcze wiΩcej swobody.

Pos│u┐my siΩ przyk│adem. W definicji stylu zagnie┐d┐anego (w nag│≤wku) mo┐emy przygotowaµ kilka klas. Niech bΩd▒ to klasy o nazwach podanym w poprzednim akapicie:

<head>
<STYLE TYPE="text/css">
<!--
P.normalny {font-family: Helvetica; font-size: 10pt}
P.przypisy {font-family: Helvetica; font-size: 8pt}
P.uwagi {font-family: Helvetica; font-size: 10pt; font-weight: bold}
P.istotne {font-family: Times; font-size: 12pt; color: red}
</STYLE>
</head>

W dokumencie mo┐emy teraz przywo│ywaµ poszczeg≤lne klasy:


Najpierw definicje:

<p class=normalny>To jest akapit pisany za pomoc▒ klasy P.normalny. Zosta│a w nim u┐yta czcionka Helvetica o wielko╢ci 10 punkt≤w. KlasΩ tΩ mo┐emy wykorzystaµ przy zapisywaniu "normalnego" tekstu, nie maj▒cego jakich╢ specjalnych wyr≤┐nie±.</p>

<p class=przypisy>W jakim╢ miejscu mo┐emy umie╢ciµ przypisy. Zapisujemy je za pomoc▒ zdefiniowanej czcionki Helvetica o wysoko╢ci 8 punkt≤w.</p>

<p class=uwagi>Gdy zajdzie konieczno╢µ podania uwag, mo┐emy wykorzystaµ klasΩ P.uwagi, kt≤ra wyr≤┐nia siΩ dodatkowym pogrubieniem tekstu.</p>

<p class=istotne> Istotne fragmenty tekstu mo┐emy w jaki╢ spos≤b wyr≤┐niµ. Tutaj korzystamy z definicji klasy P.istotne, kt≤ra pos│uguje siΩ czcionk▒ Times i kolorem czerwonym. </p>


A teraz ich efekt na ekranie:

To jest akapit pisany za pomoc▒ klasy P.normalny. Zosta│a w nim u┐yta czcionka Helvetica o wielko╢ci 10 punkt≤w. KlasΩ tΩ mo┐emy wykorzystaµ przy zapisywaniu "normalnego" tekstu, nie maj▒cego jakich╢ specjalnych wyr≤┐nie±.

W jakim╢ miejscu mo┐emy umie╢ciµ przypisy. Zapisujemy je za pomoc▒ zdefiniowanej czcionki Helvetica o wysoko╢ci 8 punkt≤w.

Gdy zajdzie konieczno╢µ podania uwag, mo┐emy wykorzystaµ klasΩ P.uwagi, kt≤ra wyr≤┐nia siΩ dodatkowym pogrubieniem tekstu.

Istotne fragmenty tekstu mo┐emy w jaki╢ spos≤b wyr≤┐niµ. Tutaj korzystamy z definicji klasy P.istotne, kt≤ra pos│uguje siΩ czcionk▒ Times i kolorem czerwonym.


Do dyspozycji mamy jeszcze jedno udogodnienie. Klasy mo┐emy uog≤lniaµ, nie wi▒┐▒c ich z konkretnym poleceniem. Nie jest konieczne wi▒zanie jakiego╢ zestawu kod≤w np. wy│▒cznie z akapitem. Mo┐emy sobie bowiem okre╢liµ klasΩ BardzoWazne, kt≤ra mo┐e siΩ odnosiµ do r≤┐nych element≤w dokumentu. Wystarczy, przyk│adowo, zapisaµ j▒ w definicji styl≤w w nag│≤wku dokumentu jako:

.BardzoWazne {font-family: Helvetica; font-size: 14pt; font-weight: bold; color: lime}

ProszΩ zwr≤ciµ uwagΩ na kropkΩ poprzedzaj▒c▒ BardzoWazne! Brak polskich liter jest uk│onem w stronΩ niedomogi Navigatora, kt≤ry nie akceptuje polskich znak≤w :-)

KlasΩ tΩ mo┐emy teraz wykorzystaµ np. w akapicie i wykazie, podaj▒c odpowiednio:

<p class=BardzoWazne>Tre╢µ akapitu</p>

< ul class=BardzoWazne>Tutaj s▒ punkty wykazu</ul>

Efekt na ekranie:

To jest BardzoWa┐ny akapit