CSS block-size egenskap

Föregående sida background-size
Nästa sida border

Kursrekommendation:

block-size Definition och användning

egenskap specificerar storleken på elementet i blockriktningen.Observera: relaterade CSS egenskaper writing-mode block-size egenskap definierar blockriktningen, vilket påverkar

CSS: block-size och inline-size egenskaper är lika med CSS: width och height egenskaper är mycket lika, men block-size och inline-size Egenskapen är beroende av blockriktning och inre riktning.

Exempel

Exempel 1

Ställ in storleken på <div>-elementet i blockriktningen:

div {
  block-size: 200px;
}

Prova själv

Exempel 2

När writing-mode egenskapsvärdet för <div>-elementet är satt till vertical-rl, ändras blockriktningen från nedåt till horisontell, vilket förändrar riktningen som block-size egenskapen verkar på:

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

Prova själv

CSS syntax

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

Egenskapsvärde

Värde	Beskrivning
auto	Standard. Standardvärde för elements block-size.
length	Specificera block-size i enheter som px, pt, cm osv. Se vidare:CSS enheter.
%	Specificera block-size som en procentsats av storleken på föräldrelementet på motsvarande axel.
initial	Sätt denna egenskap till dess standardvärde. Se vidare initial.
inherit	Inheritera denna egenskap från föräldrelementet. Se vidare inherit.

Tekniska detaljer

Standardvärde:	auto
Arv:	Nej
Animation production:	Stöd. Se vidare:Animation relaterade egenskaper.
Version:	CSS3
JavaScript syntax:	object.style.blockSize="100px"