tutoriais mais recente desenvolvimento web
 

Style padding Property

<Estilo de objeto

Exemplo

Defina o preenchimento de um <div> elemento:

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

Definição e Uso

Os conjuntos de propriedades de preenchimento ou retorna o preenchimento de um elemento.

Esta propriedade pode levar de um a quatro valores:

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.

  • Um valor, como: div {padding: 50px} - todos os quatro lados terá um preenchimento de 50px
  • Dois valores, como: div {padding: 50px 10px} - a parte superior e inferior de preenchimento será 50px, esquerda e estofamento direita será 10px
  • Três valores, como: div {padding: 50px 10px 20px} - o preenchimento superior será 50px, esquerda e estofamento direita será 10px, estofamento fundo será 20px
  • Quatro valores, como: div {padding: 50px 10px 20px 30px} - o preenchimento superior será 50px, estofamento direita será 10px, estofamento fundo será 20px, preenchimento à esquerda será 30px

Suporte navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

A propriedade preenchimento é suportado em todos os principais navegadores.

Sintaxe

Devolver a propriedade padding:

object .style.padding

Defina a propriedade padding:

object .style.padding=" Valores de propriedade
Valor Descrição
% Define o preenchimento em% da largura do elemento pai
length Define o preenchimento em unidades de comprimento
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 cadeia, representando a cobertura de um elemento
CSS Versão CSS1

mais Exemplos

Exemplo

Alterar o preenchimento de todos os quatro lados de um <div> elemento para "25px" :

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

Exemplo

Devolver o preenchimento de um <div> elemento:

alert(document.getElementById("myDiv").style.padding);
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: Padding CSS

Referência CSS: padding property

<Estilo de objeto