A propriedade CSS padding-block

Página anterior padding
Próxima página padding-block-end

definição e uso

do elemento padding-block é o espaço entre a borda e o conteúdo na direção do bloco, é uma abreviação dos seguintes atributos:

padding-block 属性的值可以通过不同的方式设置：

Os valores da propriedade podem ser configurados de diferentes maneiras:

padding-block: 10px 50px;

Se a propriedade padding-block tiver dois valores:
A margem interna inicial é de 10px

A margem interna final é de 50px

Se a propriedade padding-block tiver um valor:

padding-block: 10px;

A margem interna inicial e final é de 10px padding-block e padding-inline CSS As propriedades e as propriedades CSSpadding-bottompadding-toppadding-bottom, e padding-left padding-right padding-block e padding-inline A propriedade depende da direção de bloco e da direção de linha.

Nota:propriedades CSS relacionadas writing-mode Define a direção de bloco. Isso afeta a posição inicial e final do bloco e padding-block O resultado da propriedade. Para páginas em inglês, a direção de bloco é descendente e a direção de linha é de esquerda para direita.

Exemplo

Exemplo 1

Defina o preenchimento interno dos lados da direção de bloco:

p {
  padding-block: 35px;
}

Experimente você mesmo

Exemplo 2

Quando o elemento <div> writing-mode Quando o valor da propriedade writing-mode é vertical-rl, a posição inicial do elemento move-se para a direita a partir da parte superior e a posição final move-se para a esquerda a partir da parte inferior:

div {
  writing-mode: vertical-rl;
  padding-block: 10px 50px;
}

Experimente você mesmo

Sintaxe CSS

padding-block: auto|value|initial|inherit;

Valor da propriedade

Valor	Descrição
auto	Valor padrão. O valor padrão de padding-block do elemento.
length	Especifique o padding-block em unidade de px, pt, cm, etc. Não são permitidos valores negativos. Veja:Unidades CSS.
%	Especifique o padding-block como uma porcentagem do tamanho do elemento pai na direção de linha.
initial	Defina essa propriedade para seu valor padrão. Veja initial.
inherit	Herda essa propriedade do elemento pai. Veja inherit.

Detalhes técnicos

Valor padrão:	auto
Herança:	Não
Produção de animação:	Suporte. Veja:Propriedades relacionadas a animação.
Versão:	CSS3
Sintaxe JavaScript:	object.style.paddingBlock="100px 50px"