Programozott tananyag:
A helyzetmegadás fajtái
Statikus helyzetmegadás (static), Relatív helyzetmegadás (relative), Független helyzetmegadás (absolute), Rögzített helyzetmegadás (fixed)
Eltolás mértékének megadása
A top: tulajdonság segítségével a helyzetmegadásos elemek margójának felső külső széle és tárolótömbjének felső széle közötti távolságot adhatjuk meg....
Statikus helyzetmegadás
A statikus helyzetmegadás az alapértelmezett. A HTML elem a szövegfolyamban az eredeti helyén marad.
Relatív helyzetmegadás
A HTML elemet egy általunk megadott értékkel eltolhatunk az eredeti helyzetéhez képest, de továbbra is a szövegfolyamban marad.
Független helyzetmegadás (absolute)
A HTML elem helyzete teljesen független a szövegfolyamtól. Helyzetét azon tárolótömbjéhez viszonyítva adhatjuk meg, amely a dokumentumfán az utolsó relatív helyzetmegadású őse az elemnek.
Abszolút pozíciónálású oszlopok
Az oldal szerkezetének kialakításánál is gyakran használjuk a független (absolute) helyzetmegadást.
Z-index avagy a 3. dimenzió
A láthatósági sorrend módosítható a z-index tulajdonság segítségével. A z-index növelésével adott elem (a z-tengely mentén) közelíthető a látogató felé.
A z-index dinamikus módosítása
A :hover dinamikus álosztály kijelölő segítségével a z-index növelése útján előtérbe hozhatjuk azokat a HTML elemeket, amelyek fölött az egérkurzor áll.
Rögzített helyzetmegadás (fixed)
A böngészőablak látható részéhez rögzített lesz a HTML elem, és így mindig látható marad. A független helyzetmegadás speciális esete, ahol a képernyő a viszonyítási pont.
A túlnyúlás kezelése (overflow)
Ha egy tárolóelem méretét meghaladja a benne elhelyezett tartalom, akkor a kilógó területek kezelésének módját, az overflow tulajdonság segítségével adhatjuk meg.
A vízszintes túlnyúlás kezelése
A kilógó területek kezelésének módját, vízszintes irányban az overflow-x tulajdonság segítségével adhatjuk meg.
A függőleges túlnyúlás kezelése
A kilógó területek kezelésének módját, függőleges irányban az overflow-x tulajdonság segítségével adhatjuk meg.
Látható terület kijelölése (clip)
A clip tulajdonság segítségével kijelölhető egy HTML elem megjelenítendő területe.
Megjelenítés módja (display tulajdonság )
A display tulajdonság határozza meg a HTML elemhez generált doboz típusát. Ezen keresztül pedig megjelenítésének módját.
Láthatóság (visibility)
A visibility visibility tulajdonság segítségével egy HTML elem elrejthető vagy láthatóvá tehető. Az elrejtett elem elem helye megmarad a weboldal elrendezésében.
CSS pozícionáló
tulajdonságok
a tananyagban
| position | CSS3 |
| top | CSS3 |
| bottom | CSS3 |
| left | CSS3 |
| right | CSS3 |
| z-index | CSS3 |
| overflow | CSS3 |
| overflow-x | CSS3 |
| overflow-y | CSS3 |
| clip | CSS3 |
| display | CSS3 |
| visibility | CSS3 |