CSS border-image-slice özelliği

tanım ve kullanım

border-image-slice özelliği, görüntü kenarının içe doğru kaymasını belirtir.

bkz.:

CSS3 dersleri:CSS3 Kenarlar

örnek

görüntü kenarının içe doğru kaymasını belirtir:

div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}

CSS dilbilgisi

border-image-slice: number|%|doldurma;

yorum:Bu özellik, görüntünün üst, sağ, alt ve sol kenarlarının içe doğru kaymasını belirtir; görüntü dokuz bölüme ayrılır: dört köşe, dört kenar ve bir orta bölge. fill anahtar kelimesi kullanılmadıkça, orta görüntü bölümü atılır. Dördüncü sayıyı/percentajı belirtmeyen durumda, ikinci değere eşittir. Üçüncü değeri belirtmeyen durumda, birinci değere eşittir. İkinci değeri belirtmeyen durumda, birinci değere eşittir.

özellik değeri

değer tanım
number rakam değeri, görüntüdeki piksel (raster görüntü ise) veya vektör koordinatları (vektör görüntü ise).
% görüntü boyutlarına göre yüzdelik değerler: görüntü genişliği yatay kaymayı etkiler, yükseklik dikey kaymayı etkiler.
doldurma çerçeve resminin ortasını saklar.

teknik ayrıntılar

varsayılan değer: 100%
miras edilebilirlik: hayır
sürüm: CSS3
JavaScript dilbilgisi: object.style.borderImageSlice="50% 50%"

tarayıcı desteği

tablodaki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtmektedir.

Chrome IE / Edge Firefox Safari Opera
15.0 11.0 15.0 6.0 15.0

bkz. border-image özellik.