CSS/Margines

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

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

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

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.