CSS block-size eigenschap

Aanbevolen cursus:

block-size Definitie en gebruik

De eigenschap specificeert de grootte van het element op de blokkenrichting.Let op: gerelateerde CSS eigenschappen writing-mode block-size eigenschappen definiëren de blokkenrichting, wat de invloed heeft op

CSS. block-size en inline-size eigenschappen zijn vergelijkbaar met de van CSS. width en height eigenschappen zijn zeer vergelijkbaar, maar block-size en inline-size De eigenschap is afhankelijk van de blokkenrichting en de inline-richting.

Voorbeeld

Voorbeeld 1

Stel de grootte van het <div>-element in op de blokkenrichting:

div {
  block-size: 200px;
}

Probeer het zelf uit

Voorbeeld 2

Wanneer de waarde van de eigenschap writing-mode van het <div>-element vertical-rl is ingesteld, verandert de blokkenrichting van naar beneden naar horizontaal, wat de werking van de eigenschap block-size beïnvloedt:

div {
  block-size: 250px;
  writing-mode: vertical-rl;
}

Probeer het zelf uit

CSS syntaxis

inset-block: auto|length|initial|inherit;

Eigenschapswaarde

Waarde Beschrijving
auto Standaard. De standaardwaarde van block-size voor het element.
length Specificeer block-size in eenheid zoals px, pt, cm, enz. Raadpleeg ook:CSS Units.
% Specificeer block-size als een percentage van de grootte van het ouderlijke element op de overeenkomstige as.
initial Stel deze eigenschap in op de standaardwaarde. Raadpleeg initial.
inherit Deze eigenschap erft van de ouderlijke element. Raadpleeg inherit.

Technische details

Standaardwaarde: auto
Inheritantie: nee
Animatie maken: ondersteund. Raadpleeg:Animatiegerelateerde eigenschappen.
Versie: CSS3
JavaScript syntaxis: object.style.blockSize="100px"

Browserondersteuning

De cijfers in de tabel geven de browserversie aan die de eigenschap volledig ondersteunt.

Chrome Edge Firefox Safari Opera
57.0 79.0 41.0 12.1 44.0

gerelateerde pagina's

CSS handleiding:CSS hoogte en breedte

CSS handleiding:CSS box model

CSS referentie:height eigenschap

CSS referentie:width eigenschap

CSS referentie:writing-mode eigenschap