A propriedade CSS padding-block-start

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

Definição e uso

do elemento padding-block-start refere-se ao espaço entre a borda e o conteúdo no início da direção do bloco.

CSS padding-block e padding-inline propriedades são semelhantes às propriedades CSS padding-top,padding-bottom,padding-left e padding-right muito semelhante, mas 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 inicial e final 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 é da esquerda para a direita.

Exemplo

Exemplo 1

Defina o espaçamento interno no início da direção do bloco:

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

Experimente você mesmo

Exemplo 2

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

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

Experimente você mesmo

Sintaxe do CSS

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

Valor da propriedade

Valor	Descrição
auto	Padrão. O valor padrão de padding-block-start do elemento.
length	Defina padding-block-start em unidades como px, pt, cm. Não são permitidos valores negativos. Veja:Unidades CSS.
%	Defina padding-block-start como um percentual da largura do elemento pai na direção da linha.
initial	Defina essa propriedade como 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.paddingBlockStart="100px"