A propriedade CSS padding-block-end

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

Recomendação de curso:

Definição e uso do elemento padding-block-end

refere-se ao espaço entre a borda do elemento e o conteúdo na extremidade do bloco direcional. padding-block e padding-inline CSS propriedades são semelhantes, maspadding-bottompadding-toppadding-bottom, e padding-left padding-right padding-block e padding-inline A propriedade depende da direção do bloco e da direção da linha.

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

Exemplo

Exemplo 1

Defina o espaçamento interno na extremidade do bloco direcional:

p {
  padding-block-end: 35px;
}

Experimente você mesmo

Exemplo 2

Defina o <div> elemento writing-mode Quando a propriedade é definida como vertical-rl, a direção do bloco é de direita para esquerda. O resultado é que a posição final do elemento se move para a esquerda a partir da parte inferior:

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

Experimente você mesmo

Sintaxe do CSS

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

Valor da propriedade

Valor	Descrição
auto	Padrão. O valor padrão de padding-block-end do elemento.
length	Especifique padding-block-end em unidades como px, pt, cm. Não são permitidos valores negativos. Veja:Unidades CSS.
%	Especifique padding-block-end 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:	Suportado. Veja:Propriedades relacionadas a animação.
Versão:	CSS3
Sintaxe do JavaScript:	object.style.paddingBlockEnd="100px"