CSS/Margines

Obramowanie


Margines w CSS to obszar otaczający element (na zewnątrz obramowania), który oddziela go od innych elementów strony internetowej.

Dla marginesu istnieje jeden atrybut zbiorczy margin ,oraz 4 atrybuty szczegółowe: margin-top, margin-right, margin-bottom, margin-left. Dla każdego z nich możemy wpisać wartość podaną w dowolnych jednostkach lub słowo inherit (oznaczające dziedziczenie).

margin

edytuj

Poniżej znajdują się trzy sposoby zapisania właściwości margin.

margin: 20px;
Ustawia margines we wszystkich kierunkach na 20 pikseli.
margin: 10px 20px;
Ustawia margines górny i dolny na 10 pikseli ,a prawy i lewy na 20 pikseli
margin: 10px 20px 15px 25px;
Ustawia margines górny na 10 pikseli ,prawy na 20 pikseli ,dolny - 15 pikseli ,a lewy na 25 pikseli

margin-top, margin-right, margin-bottom, margin-left

edytuj
margin-top: 5px;
Ustawia górny margines
margin-bottom: 5px;
Ustawia dolny margines
margin-left: 5px;
Ustawia lewy margines
margin-right: 5px;
Ustawia prawy margines

Zastosowanie marginesów

edytuj

Poza typowo estetyczną funkcją (odseparowanie od siebie różnych elementów), marginesy są stosowane do tworzenia bardziej skomplikowanych wystrojów stron internetowych, jak na przykład dwu- i trzy-kolumnowych układów treści.