Krom∞ jednoduchΘ specifikace font∙, velikostφ a styl∙ umo₧≥ujφ CSS webov²m
nßvrhß°∙m rozmφstit pφsmo ve vφcero vrstvßch s naprostou p°esnostφ. CSS u₧φvß v souvislosti s vrstvami
webovΘ strßnky termφn "z-index". Z-index odpovφdß ose Z, kterß je kolmß na ob∞ osy X a Y okna prohlφ₧eΦe. S
pou₧itφm z-indexu mohou CSS umφstit pφsmo v r∙zn²ch ·rovnφch (nebo rovinßch) k vytvo°enφ efektu
vrstvenΘho pφsma. P°i absolutnφm pozicovßnφ typografick²ch prvk∙, CSS vychßzejφ z "hornφho"
a "levΘho" umφst∞nφ od okraj∙ okna prohlφ₧eΦe.
Do hlaviΦky HTML dokumentu nebo do
externφho souboru
vlo₧φme k≤d:
Text za // do k≤du nepiÜte - jde o komentß°.
< STYLE TYPE="text/css">
// zaΦßtek delkaracφ styl∙ - POUZE V HLAVI╚CE!
.
jmΘno_vrstvy {
// deklarace stylu pro vrstvu pφsma
position: absolute;
// definice absolutnφho pozicovßnφ pφsma
top:
Φφslo px;
// odsazenφ vrstvy od hornφho
okraje okna prohlφ₧eΦe
left:
Φφslo px;
// odsazenφ vrstvy od levΘho
okraje okna prohlφ₧eΦe
z-index:
p°irozenΘ_Φφslo;
//
Φφslo vrstvy 1, 2, 3, ...; vrstva s vyÜÜφm Φφslem p°episuje vrstvu s ni₧Üφm Φφslem
...
// sem p°ijdou definice vlastnostφ pφsma
}
// konec deklarace stylu pro vrstvu pφsma
...
// sem p°ijdou deklarace dalÜφch vrstev
< /STYLE>
// konec delkaracφ styl∙ - POUZE V HLAVI╚CE!
POZOR!
Nezapomφnejte na ST╪EDN═K za ka₧dou definovanou vlastnostφ stylu!
V t∞le dokumentu pou₧φvejte tag < SPAN CLASS="
jmΘno_vrstvy">!