2.6 KiB
| title | localeTitle |
|---|---|
| Padding | Preenchimento |
Preenchimento
A propriedade CSS de padding define a área de preenchimento em todos os quatro lados de um elemento. Essa propriedade pode ser usada para gerar espaço ao redor do conteúdo (dentro da borda). É uma abreviação para definir todos os acolchoamentos individuais de uma só vez: padding-top , padding-right , padding-bottom e padding-left . Os valores são definidos no sentido horário.
Os valores de preenchimento são definidos usando comprimentos ou porcentagens ou inherit palavra-chave e não podem aceitar valores negativos. O valor inicial ou padrão para todas as propriedades de preenchimento é 0. Embora você possa usar a palavra-chave inherit mas não pode ser usado junto com um valor de comprimento.
Sintaxe
.element {
padding: [padding-top] || [padding-right] || [padding-bottom] || [padding-left];
}
Essa propriedade pode ser especificada usando um, dois, três ou quatro valores.
- Quando um valor é especificado, ele aplica o mesmo preenchimento aos quatro lados.
- Quando dois valores são especificados, o primeiro preenchimento se aplica à parte superior e inferior, o segundo à esquerda e à direita.
- Quando três valores são especificados, o primeiro preenchimento é aplicado ao topo, o segundo à esquerda e à direita e o terceiro à parte inferior.
- Quando quatro valores são especificados, os preenchimentos são aplicados na parte superior, direita, inferior e esquerda nessa ordem (sentido horário).
/* em refers to the current font size of an element */
/* Apply to all four sides */
padding: 1em;
/* top and bottom | left and right */
padding: 5% 10%;
/* top | left and right | bottom */
padding: 1em 2em 2em;
/* top | right | bottom | left */
padding: 5px 1em 0 1em;
Onde no modelo de caixa
A propriedade de preenchimento em CSS define a parte mais interna do modelo de caixa, criando espaço em torno do conteúdo de um elemento, dentro de quaisquer margens e / ou bordas definidas.
Suporte de Navegador
É efetivamente suportado em todos os navegadores (desde IE6 +, Firefox 2+, Chrome 1+ etc)