CSS margin-block-start özelliği

Önceki sayfa margin-block-end
Sonraki sayfa margin-bottom

Tanım ve Kullanım

margin-block-start Özelliği, blok yönlü başlangıç dış kenar boşluğunu belirtir.

CSS'nin margin-block ve margin-inline Özellikleri CSS'nin margin-top,margin-bottom,margin-left ve margin-right Özellikleri çok benzerdir, ancak margin-block ve margin-inline Özellik, blok yönlü ve satır yönlüye bağlıdır.

Not:İlgili CSS Özellikleri writing-mode Blokların yönünü tanımlar. Bu, blokların başlangıç ve bitiş konumlarını ve margin-block-start özelliği sonucunu etkiler. İngilizce sayfalar için blok yönlü aşağıya doğru, satır yönlü soldan sağa doğru olur.

Örnek

Örnek 1

Blok yönlü başlangıç dış kenar boşluğunu ayarlar:

div {
  margin-block-start: 35px;
}

Kişisel Deneyim

Örnek 2

<div> elementinin writing-mode Özellik değeri vertical-rl olarak ayarlandığında, blok yönlü sağdan sola olur. Sonuç olarak, elemanın başlangıç konumu üstten sağa taşınır. Bu yüzden, writing-mode değişikliği de blokun başlangıç ve bitiş konumunu ve margin-block-start özelliği sonucunu etkiler. margin-block-start Sonuç:

#parentDiv {
  writing-mode: vertical-rl;
}
#myDiv {
  margin-block-start: 50px;
}

Kişisel Deneyim

CSS Dilbilgisi

margin-block-start: auto|length|initial|inherit;

Özellik Değeri

Değer	Açıklama
auto	Varsayılan Değer. Elemanın varsayılan dış kenar boşluğu mesafesi.
length	Mesafeyi belirtin, birimleri px, pt, cm vb. olabilmektedir. Negatif değerlere izin verilir. Bakınız:CSS Birimleri.
%	Ebeveyn elementine göre satır yönlü olarak belirtilen yüzdelik mesafeyi belirtir.
initial	Bu özelliği varsayılan değerine ayarlar. Bakınız initial.
inherit	Bu özelliği ebeveyn elementinden devralır. Bakınız inherit.

Teknik Ayrıntılar

Varsayılan Değer:	auto
Devralabilirlik:	Hayır
Animasyon Yapımı:	Desteklenir. Bakınız:Animasyon İle İlgili Özellikler.
Sürüm:	CSS3
JavaScript Dilbilgisi:	object.style.marginBlockStart="100px"