Pozycjonowanie odpowiada za umiejscowanie elementu w dowolnie wybranym miejscu przez zastosowanie właściwości position
. Rozróżniamy dwa rodzaje pozycjonowania:
- pozycjonowanie względne, nazywane również relatywnym (ang.
relative
), pozwala na zmianę położenia elementu w stosunku do jego położenia początkowego. Wykorzystuje się w tym celu dodatkowe cztery właściwości:top
,left
,right
,bottom
, którym należy przypisać odpowiednie wartości (w odpowiednich jednostkach miary) odpowiadającym przesunięciom w górę, lewo, prawo i do dołu. - pozycjonowanie bezwzględne, nazywane również absolutnym (ang.
absolute
), pozwala na ustalenie położenia elementu w stosunku do ram okna przeglądarki lub innego elementu nadrzędnego. Wykorzystuje się w tym celu dodatkowo cztery właściwości:top
,left
,right
,bottom
. Jednostki najlepiej przydatne:px
,%
,em
.
Zobacz model pudełkowy.
Zadanie 1. Utwórz stronę, na której znajdują się znaczniki grupujące. Dla każdego z nich zdefiniuj margines, obramowanie i odstępy. Użyj znaczników margin
i padding
. Treść strony - dowolna.