CSS Margin Properties
CSS margin właściwości są wykorzystywane do generowania przestrzeń wokół elementów.
W margin właściwości ustawić rozmiar białej przestrzeni poza granicę.
Ten element ma margin na 80px.
CSS Margins
CSS margin właściwości ustawić rozmiar białej przestrzeni poza granicę.
 | Uwaga: margins są całkowicie przejrzyste - i nie może mieć kolor tła! |
|---|
Z CSS, masz pełną kontrolę nad margins . Są to właściwości CSS do ustawiania margin dla każdej strony elementu (górny, prawy, dolny i lewy).
Margin - poszczególnych boków
CSS ma właściwości określający margin dla każdej strony elementu:
-
margin-top -
margin-right -
margin-bottom -
margin-left
Wszystkie margin właściwości może mieć następujące wartości:
- auto - przeglądarka oblicza margin
- długość - określa margin w px, pt, cm , etc.
- % - Określa margin w% szerokości elementu zawierającego
- dziedziczy - określa, że margin powinna być dziedziczone z elementu nadrzędnego
| Uwaga: Można również stosować wartości ujemne na margins ;pokrywać treści. |
|---|
Poniższy przykład ustawia różne margins dla wszystkich czterech bokach <p> element:
Przykład
p {
margin-top: 100px;
margin-bottom: 100px;
margin-right: 150px;
margin-left: 80px;
} Spróbuj sam " Poniższy przykład pozwala lewy margin być dziedziczone z elementu nadrzędnego:
Przykład
div.container {
border: 1px solid red;
margin-left: 100px;
}
p.one {
margin-left:
inherit;
} Spróbuj sam " Margin - Skrót nieruchomości
Aby skrócić ten kod, możliwe jest określenie wszystkich margin właściwości w jednym obiekcie.
margin nieruchomość jest skróconą własnością dla następujących indywidualnych margin właściwości:
-
margin-top -
margin-right -
margin-bottom -
margin-left
Więc, oto jak to działa:
Jeśli margin Obiekt ma cztery wartości:
- margin : 25px 50px 75 pikseli 100px;
- górny margines wynosi 25px
- prawy margines jest 50px
- dolny margines wynosi 75 pikseli
- lewy margines jest 100px
Jeśli margin Nieruchomość posiada trzy wartości:
- margin : 25px 50px 75 pikseli;
- górny margines wynosi 25px
- prawy i lewy margines są 50px
- dolny margines wynosi 75 pikseli
Jeśli margin Nieruchomość posiada dwie wartości:
- margin : 25px 50px;
- Górne i dolne marginesy są 25px
- prawy i lewy margines są 50px
Jeśli margin Nieruchomość posiada jedną wartość:
- margin : 25px;
- wszystkie cztery marginesy są 25px
Zastosowanie automatycznego Wartość
Można ustawić margin właściwość auto do poziomo wyśrodkować element jego kontenerze.
Element będzie trwać określoną szerokość, a pozostała przestrzeń zostanie podzielona równo pomiędzy lewym i prawym margins :
Sprawdź się z ćwiczeń!
Ćwiczenie 1 » Ćwiczenie 2» Ćwiczenie 3 » Ćwiczenia 4»
Wszystkie właściwości CSS Margin
| Nieruchomość | Opis |
|---|---|
| margin | Skrót nieruchomość do ustawiania margin właściwości w jednej deklaracji |
| margin-bottom | Ustawia dolny margin elementu |
| margin-left | Ustawia lewy margin elementu |
| margin-right | Ustawia prawy margin elementu |
| margin-top | Ustawia górny margin elementu |