O marginesach w CSS

O marginesach w CSS

Marginesy w CSS określają miejsca otaczające jakiś obiekt. Margines może nieco oczyścić okolicę obiektu od zewnętrznej strony jego granicy. Margines jest przeźroczysty więc jest odpowiedni dla każdego rodzaju strony a dzięki temu, że można określić inną jego wartość dla każdej strony obiektu jest bardzo wszechstronny.

Jak używać marginesów w CSS;

Oto wartości używane do określania marginesów:

    • auto- Używając auto pozwalasz przeglądarce na określenie odstępu.
    • length- Określa długość marginesu. Może być zdefiniowana przy użyciu pikseli albo jakiejś innej miary. Domyślna wartość to 0px.
    • %- Użycie ego oznacza zdefiniowanie marginesu w oparciu o długość elementu.
    • inherit- To oznacza, że margines powinien odziedziczyć wartość marginesu.

 

Ale jak wspomnieliśmy można określić inną wartość marginesu dla każdej strony niezależnie. Oto jak tego dokonać:

margin-top:100px;
margin-bottom:100px;
margin-right:60px;
margin-left:60px;

Taki kod można jeszcze skrócić do wartości:

margin:100px 45px; 

Skracanie cztery do jednego:

Jeśli każdy bok elementu ma inny margines można to zapisać w jednej linii kodu – nie trzeba w czterech:

 

margin:35px 50px 75px 100px;

Górny margines jest ustawiony na 35px

Prawy margines jest ustawiony na 50px

Dolny margines jest ustawiony na 75px

Lewy margines jest ustawiony na 100px

margin:45px 50px 75px;

Górny margines jest ustawiony na 45px

Prawy margines jest ustawiony na 50px

Dolny margines jest ustawiony na 75px

margin:25px 50px;

Górny i dolny margines jest ustawiony na 25px

Lewy i prawy margines jest ustawiony na 50px

margin:35px;

Wszystkie cztery marginesy ustawione są na 35px


Comments are closed.