Margin-block-start - CSS Hileleri

CSS'deki margin-block-startözellik, blok yönündeki bir öğenin dış başlangıç kenarı boyunca boşluk miktarını tanımlar. Şu anda Çalışma Taslağında bulunan CSS Mantıksal Özellikleri Seviye 1 spesifikasyonuna dahil edilmiştir.

.element ( margin-block-start: 25%; writing-mode: vertical-lr; )

Blok yönünde başlangıç uç elemanı 's belirlenir writing-mode, directionve text-orientation. Dolayısıyla, margin-block-startsoldan sağa yatay bir bağlamda kullanıldığında, tıpkı margin-topöğenin başlangıç kenarı onun üst kısmı gibi davranır .

Ancak writing-modedikey olarak değiştirirsek, öğe döndürülerek başlangıç kenarı sola doğru yerleştirilir. Sonuç olarak aynı şekilde margin-block-startdavranır margin-left. Temel olarak, başlangıç kenarı aktığı yöne bağlıdır. "Mantıksal" özelliklerden bahsederken kastettiğimiz budur.

Sözdizimi

margin-block-start:

Bir özelliğin sözdiziminin doğrudan dokümantasyonda başka bir CSS özelliğinin sözdizimine başvurduğunu görmek biraz tuhaf, ama gerçekte olan bu. Temel olarak söylemeye çalıştığı şey, mülkün margin-topbu sözdizimini izleyen aynı değerleri kabul ettiği :

margin-top: | | auto;

Başlangıç değeri: 0
Şunlar için geçerlidir: dahili tablo öğeleri, yakut temelli kaplar ve yakut detaylandırma kutuları hariç tüm öğeler
Devralındı: hayır
Yüzdeler: karşılık gelen fiziksel özellik için
Hesaplanan değer: karşılık gelen margin-*özelliklerle aynı
Animasyon türü: hesaplanan değer türüne göre

Değerler

margin-block-start tek bir uzunluk veya anahtar kelime değerini kabul eder.

/* Length values */ margin-block-start: 20px; margin-block-start: 2rem; margin-block-start: 25%; /* Keyword values */ margin-block-start: auto; /* Global values */ margin-block-start: inherit; margin-block-start: initial; margin-block-start: unset;