tutoriais mais recente desenvolvimento web
 

Style margin Property

<Estilo de objeto

Exemplo

Definir todas as quatro margens de um <div> elemento:

document.getElementById("myDiv").style.margin = "50px 10px 20px 30px";
Tente você mesmo "

Definição e Uso

Os conjuntos de propriedades de margem ou retorna à margem de um elemento.

Esta propriedade pode levar de um a quatro valores:

  • Um valor, como: div {margin: 50px} - todas as quatro margens será 50px
  • Dois valores, como: div {margin: 50px 10px} - O margens superior e inferior será 50px, margens esquerda e direita será 10px
  • Três valores, como: div {margin: 50px 10px 20px} - a margem superior será 50px, esquerda e margem direita será 10px, margem inferior será 20px
  • Quatro valores, como: div {margin: 50px 10px 20px 30px} - a margem superior será 50px, margem direita será 10px, margem inferior será 20px, margem esquerda será 30px

Tanto a propriedade de margem ea propriedade estofamento inserção espaço em torno de um elemento. No entanto, a diferença é que a margem insere o espaço em torno da borda, enquanto insere o preenchimento do espaço dentro da borda de um elemento.

Suporte navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

A propriedade margem é suportada em todos os principais navegadores.

Sintaxe

Devolver a propriedade margin:

object .style.margin

Defina a propriedade margin:

object .style.margin=" Valores de propriedade
Valor Descrição
% Define as margens em% da largura do elemento pai
length Define as margens em unidades de comprimento
auto O navegador define as margens (all four margins will be equal)
initial Define essa propriedade para seu valor padrão. Leia sobre inicial
inherit Herda esta propriedade a partir de seu elemento pai. Leia sobre herdar

Detalhes técnicos

Valor padrão: 0
Valor de retorno: Uma corda, representando as margens de um elemento
CSS Versão CSS1

mais Exemplos

Exemplo

Altere todas as quatro margens de um <div> elemento para "25px" :

document.getElementById("myDiv").style.margin = "25px";
Tente você mesmo "

Exemplo

Retorno das margens de um <div> elemento:

alert(document.getElementById("myDiv").style.margin);
Tente você mesmo "

Exemplo

Diferença entre a propriedade de margem e a propriedade padding:

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

function changePadding() {
    document.getElementById("myDiv2").style.padding = "100px";
}
Tente você mesmo "

Páginas relacionadas

CSS tutorial: Margem CSS

Referência CSS: margin property

<Estilo de objeto