CSS scroll-margin-inline-end özelliği
- Önceki Sayfa scroll-margin-inline
- Sonraki Sayfa scroll-margin-inline-start
Tanım ve kullanım.
scroll-margin-inline-end
Özellik, satır içi yönelimde sabitlenme konumu ile konteyner arasındaki mesafeyi belirtir.
Bu, kaydırma işlemi durduğunuzda, hızla ayarlanır ve belirtilen mesafede durar, bu mesafe, alt elemanın son端的 sabitlenme konumu ile konteyner arasındaki mesafedir.
Satır içi yönelim, bir karakterin mevcut karaktere göre satır içinde konumlandırılacağı yöndür. Bu, CSS display: inline; olan etiketlerin (örneğin <a> ve <strong> etiketleri) metin içindeki düzen tarzıdır. Satır içi yönelim yazı diliye bağlıdır; örneğin, Arapçanın yeni karakterleri sağdan sola dizilir, bu yüzden satır içi yönelim sağdan sola olurken, İngilizce sayfaların satır içi yönelimi sola sağa olur. Satır içi yönelim CSS özelliği aracılığıyla belirlenebilir direction
ve writing-mode
Tanım.
Sabitlenme konumu, kaydırma işlemi durduğunuzda alt elemanın konteyner içinde sabitlendiği konum anlamına gelir.
Dikkat:Dikkat: scroll-snap-align Bu özellik yalnızca satır içi yönelimde ayarlandığında geçerlidir.
Özellik 'end' olarak ayarlandığında yalnızca çalışır. scroll-margin-inline-end
Özelliği etkisini görmek için, çocuğu elementinde scroll-margin-inline-end
ve scroll-snap-align
Özelliği, ebeveyn elementinde scroll-snap-type
Özellikleri ile
CSS'nin scroll-margin-inline
ve scroll-margin-block
Özellikler, CSS özellikleri CSS scroll-margin-top özelliği
,scroll-margin-bottom
,scroll-margin-left
ve scroll-margin-right
Oldukça benzer, ancak scroll-margin-block
ve scroll-margin-inline
Özellik, blok yönelimine ve satır içi yönelimine bağlıdır.
Örnek
Örnek 1
Satır içi yönelimde tutturucudan kayan konteynıra olan mesafeyi ayarlar:
div { scroll-margin-inline-end: 20px; }
Örnek 2
<div> elementinin writing-mode
Özellik değeri vertical-rl olarak ayarlandığında, satır içi yönelim aşağı doğru olur. Sonuç olarak, elementin ucu sağdan aşağı doğru hareket eder:
div { scroll-margin-inline-end: 20px; writing-mode: vertical-rl; }
Örnek 3
<div> elementinin direction
Özellik değeri rtl olarak ayarlandığında, satır içi yönelim sağdan sola doğru olur. Sonuç olarak, elementin ucu sağdan sola doğru hareket eder:
div { scroll-margin-inline-end: 20px; direction: rtl; }
CSS Dilbilgisi
scroll-margin-inline-end: 0|value|initial|inherit;
Özellik Değeri
Değer | Açıklama |
---|---|
0 | Varsayılan Değer. Elementin varsayılan scroll-margin-inline-end mesafesi. |
length |
px, pt, cm gibi birimlerle belirlenen mesafeleri belirler. Negatif değerlerin kullanımı izin verilir. Bakınız:CSS Birimleri. |
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: | 0 |
---|---|
Devralabilirlik: | Hayır |
Animasyon Yapımı: | Desteklenmiyor. Bakınız:Animasyon İle İlgili Özellikler. |
Sürüm: | CSS3 |
JavaScript Dilbilgisi: | object.style.scrollMarginInlineEnd="20px" |
Tarayıcı Desteği
Tabloda gösterilen rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
69.0 | 79.0 | 68.0 | 14.1 | 56.0 |
相关页面
Referans:CSS yönlendirme özelliği
Referans:CSS scroll-snap-align özelliği
Referans:CSS scroll-snap-type özelliği
Referans:CSS writing-mode özelliği
- Önceki Sayfa scroll-margin-inline
- Sonraki Sayfa scroll-margin-inline-start