border-image-width Özelliği Temel Özellikler
- CSS Yazımı :
border-image-width: [ <uzunluk-yüzde> | <sayı> | auto ]{1,4} <uzunluk-yüzde> = <uzunluk> | <yüzde>;- Örnek :
border-image-width: 13px 40px;|border-image-width: 23px;|border-image-width: 11% 19%;- Öntanımlı Değer :
1- Uygulanabilen Etiketler :
border-collapseözelliği değericollapseolan iç tablo ögeleri dışında, tüm etiketler.::first-letterögelerine de uygulanabilir.- Kalıtsallık :
- Yok.
- Tarayıcı Desteği :
- Tüm Tarayıcılar
- Animasyon :
- Desteklenmiyor
animationÖzelliği - Javascript :
öge.style.borderImageWidth = "1rem";- Sürüm :
- CSS Backgrounds and Borders Module Level 3
- Açıklama :
- Çerçeve görselinin genişliğini belirler.
border-image-width Özelliği Kullanımı
Markanız için 300X300 alan.
CSS border-image-width özelliği; border-image özelliğinde belirtilen görselin genişliğini belirler. Eğer bu özelliğin değeri çerçeve genişliği olan border-width özelliğinde belirtilen değerden daha büyükse çerçeve görseli satır içi boşluğun (padding özelliği) (ve / veya içerik alanının) ötesine genişletilir.
CSS border-image-width özelliği değeri tekli, çift, üçlü, ve dörtlü yazımlardan herhangi biriyle kullanılabilir.
- Tek değerli kullanımda: Değer dört tarafın tümü için geçerlidir.
- Çift değerli kullanımda: İlk değer yukarı/aşağı boşlukları belirlerken ikinci değer ise sağ/sol boşlukları belirler.
- Üç değerli kullanımda: İlk değer yukarı, ikinci değer sağ/sol boşlukları, ve son değer de aşağı boşluğu belirler.
- Dört değerli kullanımda: Yukarıdan başlayarak saat yönünde yukarı, sağ, aşağı ve sol çerçeve dışı boşluklar belirlenir.
border-image-width Özelliği Tarayıcı Desteği
MasaüstüTaşınabilir
| Tarayıcı →Özellik ↓ | |||||
|---|---|---|---|---|---|
| Temel Destek | 13 | 15 | 6 | 15 | 11 |
| Tarayıcı →Özellik ↓ | |||||
|---|---|---|---|---|---|
| Temel Destek | 14 | ? | ? | ? | ? |
border-image-width Özelliğinin Alabileceği Değerler
<uzunluk-yüzde>- Çerçevenin
<uzunluk>ya da<yüzde>türünden genişliği. Yüzdelik değerler, yatay eksende çerçeve görseli alanının genişliğine göre iken, düşey eksende ise çerçeve görseli alanının yüksekliğine göredir. Eksi değer uygulanamaz. <sayı>- Uygun sayıda bir ya da daha fazla değer girilerek belirlenen çerçevenin genişliği. Eksi değer uygulanamaz.
<auto>- Çerçeve genişliği
border-image-sliceözelliğinin gerçek genişliğine ya da yüksekliğine (hangisi uygulanabilirse) eşitlenir. Eğer görselin gerçek değeri yoksaborder-widthözelliği değeri uygulanır.