ARCHIV

CSS (17.) - Generovaný obsah

V tomto díle se seznámíme s vlastnostmi pro generování obsahu.

22.12.2004 15:00 | Vasek | Články autora | přečteno 17896×

Generovaný text

Pokud chcete pomocí css umísťovat text do vašeho dokumentu, použijete vlastnost content. Jako její hodnota se používají klíčová slova.

Tato vlastnost umožňuje generovat automaticky obsah dokumentu pomocí pseudo elementů :after (po) a :before (před). Jelikož tato vlastnost není v podstatě podporována prohlížeči moc se nepoužívá.

Příklad použití

<style>
img.text:after {
content: "\APopis obrázku: " attr (alt);
}
</style>

......
<img src="img/sipka2.png" alt="to je mi, ale pěknej obrázek ;-)" class="text" />
......

to je mi, ale pěknej obrázek ;-)

Podpora v prohlížečích

NN4 nepodporuje; Mozilla (Netscape 6+) částečná podpora; IE nepodporuje; Opera částečná podpora od verze 5; IE 5/MAC nepodporuje; Konqueror částečná podpora.

Zvětšení čítače

K zvýšení hodnoty čítače lze použít vlastnost counter-increment. Jako její hodnota se používají čísla.

Tato vlastnost umožňuje číslovat jednotlivé prvky v dokumentu. Bohužel tato vlastnost patří mezi vlastnosti, které nejsou podporovány všemi prohlížeči resp. je nepodporuje IE. Jelikož IE je zatím (ať se nám to libí či nelíbí) nejpoužívanější internetový prohlížeč, doporučil bych vám se na tuto vlastnost nespoléhat. Pokud u této vlastnosti nedefinujete velikost změny je automaticky provedeno zvětšení o jednu.

Příklad použití

Podpora v prohlížečích

NN4 nepodporuje; Mozilla (Netscape 6+) částečná podpora; IE nepodporuje; Opera částečná podpora od verze 5; IE 5/MAC nepodporuje; Konqueror částečná podpora.

Nastavení čítače

K nastavení konkrétní hodnoty čítače lze použít vlastnost counter-reset. Jako její hodnota se používají čísla.

Tato vlastnost nastavuje čítač na konkrétní hodnotu. Pokud nespecifikujeme požadovanou hodnotu, nastaví se čítač na nulu. Bohužel i zde platí, to co jsem psal u vlastnosti counter-increment.

Příklad použití

Podpora v prohlížečích

NN4 nepodporuje; Mozilla (Netscape 6+) částečná podpora; IE nepodporuje; Opera částečná podpora od verze 5; IE 5/MAC nepodporuje; Konqueror částečná podpora.

Definice uvozovek

Pro specifikaci vzhledu vnořovaných uvozovek (citací) lze použít vlastnost quotes. Jako její hodnota se používají znaky.

Tato vlastnost nastavuje znaky pro otevírací a uzavírací uvozovky. Při definici je možné specifikovat několik dvojic těchto znaků navzájem oddělených čárkou. Při použití více dvojic platí pravidlo: dvojice uvedená jako první jsou hlavní uvozovky další dvojice znaků se použije uvnitř přecházejících uvozovek atd. Pomocí této vlastnosti je možné tedy specifikovat vzhled vnořovaných uvozovek.

Příklad použití

Podpora v prohlížečích

NN4 nepodporuje; Mozilla (Netscape 6+) částečná podpora; IE nepodporuje; Opera částečná podpora od verze 5; IE 5/MAC nepodporuje; Konqueror částečná podpora.

Komplexní příklad

Předcházející příklad by automaticky čísloval nadpisy první a druhé úrovně.

Závěr

Dnes jsem se seznámili vlastnostmi pro generování obsahu dokumentu pomocí kaskádových stylů. Většina těchto vlastností není podporována nejpoužívanějšími prohlížeči, což z nich dělá prakticky nepoužitelné vlastnosti. Doufejme, že v nových verzích prohlížečů se jejich podpora zlepší a tvůrci webů je budou moc používat, protože nabízejí skvělé možnosti.

Verze pro tisk