| pozycjonowanie | Pozycjonowaniepozwala zdefiniować położenie elementów na stronie internetowej. Elementy można rozmieszczać nie tylko względem brzegów strony, ale również względem jej poszczególnych elementów. Można rozmieszczac elementy tak, że jeden będzie przykrywał inny. |
| Do pozycjowania służy atrybut position selektor{ position: rodzaj; parametry; }Pozycjonowanie | |
1 |
Pozycjonowanie relatywne |
| Można przesunąć wybrany element w stosunku do naturalnego pozycjonowania elementów. Można łączyć kierunki, czyli jednocześnie ustawić odległość od na przykład lewej i górnej krawędzi. | |
| selektor {position: relative; kierunek: wielkość;}np | |
| np. selektor {position: relative; left: 10px; top: 10px;}2 | |
2 |
Pozycjonowanie absolutne |
| Dzięki temu poleceniu można przesunąć wybrany element w stosunku do wybranych krawędzi strony lub też nadrzędnego elementu tworzącego blok. Będzie to niezależne od innych elementów, a także od miejsca wpisania reguły w dokumencie.Należy zachować ostrożność, używając pozycjonowania absolutnego, ponieważ niekiedy może ono prowadzić do nieprzewidywalnych zachowań.Można łączyć kierunki, czyli jednocześnie ustawić odległość od na przykład lewej i górnej krawędzi. | |
| selektor {position: absolute; kierunek: wielkość; | |
| np. selektor {position: absolute; left: 10px; top: 10px;} | |
3 |
Pozycjonowanie ustalone |
| Dzięki temu poleceniu można ustawić na stałe wybranyelement w stosunku do krawędzi okna.Można łączyć kierunki, czyli jednocześnie ustawić odległość od na przykład lewej i górnej krawędzi. | |
| selektor {position: fixed; kierunek: wielkość;} | |
| np.selektor {position: fixed; left: 10px; top: 10px;} | |
4 |
Pozycjonowanie statyczne |
| Dzięki temu poleceniu można przywrócić naturalne pozycjonowanie elementów oparte na kolejności występowania w dokumencie HTML. Podanie jakiejkolwiek odległości nie ma żadnego wpływu na pozycję elementu. | |
| selektor {position: static;} | |
| Kolejność nakładania(warstwy nakładające się) | |
| rodzaj: "relative" -pozycjonowanie relatywne "absolute" -pozycjonowanie absolutne "fixed" -pozycjonowanie ustalone kolejność: liczba określającą kolejność, kolejność rośnie wraz z numeracjąelement z najmniejszą liczbą będzie na samym spodzie "auto" -przywraca naturalną kolejność Dzięki temu poleceniu można ustalić kolejność nakładania się elementów. W normalnym stanie elementy nakładają się wkolejności wpisywania do dokumentu HTML. Można to zmienić wstawiając własną kolejność.Kolejność nakładania dotyczy elementów pozycjonowanych. |
|
| np. selektor {position: rodzaj; kierunek: wielkość; z-index: kolejność;} |