CSS'deki background-attachmentözellik, arka planın görüntü alanına göre nasıl taşınacağını belirtir.
Üç değerler şunlardır: scroll, fixedve local. Bunu açıklamanın en iyi yolu demodur (tek tek arka planları kaydırmayı deneyin):
CodePen'de Timothy Miller (@tjacobdesign) tarafından hazırlanan Kalem Arka Planı ek demosuna bakın.
Hakkında konuşurken düşünülmesi gereken iki farklı görünüm vardır background-attachment: ana görünüm (tarayıcı penceresi) ve yerel görünüm (bunu yukarıdaki demoda görebilirsiniz).
scrollvarsayılan değerdir. Ana görünümde kayar, ancak yerel görünümde sabit kalır.
fixedne olursa olsun sabit kalır. Bu bir tür fiziksel pencere gibidir: pencerenin etrafında hareket etmek bakış açınızı değiştirir, ancak pencerenin dışındaki şeylerin nerede olduğunu değiştirmez.
localvarsayılan scrolldeğer sabit bir arka plan gibi davrandığı için icat edildi . Hem ana görünümde hem de yerel görünümde kayar. Onunla yapabileceğiniz oldukça güzel şeyler var.
İlişkili
- arka plan klibi
- arka plan rengi
- arka plan görüntüsü
- arkaplan kökenli
- arka plan konumu
- arkaplan tekrar
- arkaplan boyutu
Daha fazla kaynak
- CSS3 Özellikleri
- MDN
Tarayıcı Desteği
fixedVe scrollher ne kadar değerler, her yerde desteklenir fixedmobil üzerinde garip davranabilir. localşu tarayıcı desteğine sahip:
Bu tarayıcı destek verileri, daha fazla ayrıntıya sahip olan Caniuse'den alınmıştır. Bir sayı, tarayıcının özelliği o sürümde ve sonrasında desteklediğini gösterir.
Masaüstü Bilgisayar
| Krom | Firefox | IE | Kenar | Safari |
|---|---|---|---|---|
| 4 | 25 | 9 | 12 | 5 |
Mobil / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 4.2-4.3 | 14.0-14.4 |
Android üzerinde Chrome destekler local, ancak eski Android tarayıcısı desteklemez .