CSS block-size özelliği

Önceki sayfa background-size
Sonraki sayfa border

Tanım ve kullanım

block-size özelliği, elementin blok yönündeki boyutunu belirtir。

Dikkat:ile ilgili CSS özelliklerini writing-mode Blok yönünü tanımlar, bu da block-size özelliklerinin sonuçları. İngilizce sayfalar için, blok yönü aşağıya doğru, satır içi yönü ise soldan sağa doğru.

CSS'nin block-size ve inline-size özellikleri CSS'nin width ve height özellikleri çok benzerdir, ancak block-size ve inline-size Özellik blok yönü ve satır içi yönüne bağlıdır。

Örnek

Örnek 1

<div> elementinin blok yönündeki boyutunu ayarlayın：

div {
  block-size: 200px;
}

Kişisel deneyim

Örnek 2

Eğer <div> elementinin writing-mode özelliği değeri vertical-rl olarak ayarlanırsa, blok yönü aşağıdan yatayya dönüşür, bu da block-size özelliğinin etkili yönünü değiştirir：

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

Kişisel deneyim

CSS dilbilgisi

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

Özellik değeri

Değer	Açıklama
auto	Varsayılan. Elemanın varsayılan block-size değeri。
length	Block-size'ı px, pt, cm gibi birimlerle belirtin. Ayrıca bakınız：CSS Birimleri。
%	Block-size'ı ebeveyn elementinin ilgili eksenindeki boyutunun yüzdesi olarak belirtin。
initial	Bu özelliği varsayılan değerine ayarlar. Bakınız initial。
inherit	Bu özelliği ebeveyn elementinden miras alır. Bakınız inherit。

Teknik ayrıntılar

Varsayılan değer：	auto
Mirasçılık：	Hayır
Animasyon yapımı：	Destekleniyor. Aşağıdan bakınız：Animasyonla ilgili özellikler。
Sürüm：	CSS3
JavaScript dilbilgisi：	object.style.blockSize="100px"