Najnowsze tutoriale tworzenie stron internetowych
 

Style margin Property

<Style obiektu

Przykład

Ustaw wszystkie cztery marginesy w <div> element:

document.getElementById("myDiv").style.margin = "50px 10px 20px 30px";
Spróbuj sam "

Definicja i Wykorzystanie

Zestawy własności marginesów lub zwraca marginesów elementu.

Ta właściwość może trwać od jednego do czterech wartości:

  • Jedna wartość, jak: div {margin: 50px} - wszystkie cztery marginesy będą 50px
  • Dwie wartości, takie jak: div {margin: 50px 10px} - górny i dolny margines będzie 50px, lewy i prawy margines będzie 10px
  • Trzy wartości, takie jak: div {margin: 50px 10px 20px} - górny margines będzie 50px, lewy i prawy margines będzie 10px, margines dolny będzie 20px
  • Cztery wartości, takie jak: div {margin: 50px 10px 20px 30px} - górny margines będzie 50px, prawy margines będzie 10px, margines dolny będzie 20px, lewy margines będzie 30px

Zarówno nieruchomość margines i przestrzeń wkładka nieruchomość wyściółka wokół elementu. Jednak różnica jest taka, że ​​margines wstawia przestrzeń wokół granicy, natomiast wyściółka wkładki przestrzeń wewnątrz granicy elementu.

Wsparcie przeglądarka

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Nieruchomość margines jest dostępna we wszystkich głównych przeglądarkach.

Składnia

Zwraca właściwość margin:

object .style.margin

Ustaw właściwość margin:

object .style.margin=" wartości nieruchomości
Wartość Opis
% Określa marginesy w% szerokości elementu nadrzędnego
length Określa marginesy w jednostkach długości
auto Przeglądarka ustawia marginesy (all four margins will be equal)
initial Ustawia tę właściwość na wartość domyślną. Przeczytaj o początkowy
inherit Dziedziczy nieruchomość od swojego rodzica. Przeczytaj o dziedziczyć

Szczegóły techniczne

Domyślna wartość: 0
Zwracana wartość: Ciąg reprezentujący marginesy elementu
Wersja CSS CSS1

Więcej przykładów

Przykład

Zmień wszystkie cztery marginesy w <div> elementu do "25px" :

document.getElementById("myDiv").style.margin = "25px";
Spróbuj sam "

Przykład

Powrót marginesy w <div> element:

alert(document.getElementById("myDiv").style.margin);
Spróbuj sam "

Przykład

Różnica między właściwość marży i właściwości padding:

function changeMargin() {
    document.getElementById("myDiv").style.margin = "100px";
}

function changePadding() {
    document.getElementById("myDiv2").style.padding = "100px";
}
Spróbuj sam "

Podobne strony

Kurs CSS: CSS Margin

Odniesienie CSS: margin property

<Style obiektu