CSS border-image-slice Özelliği

CSS border-image-slice

Css border-image-slice özelliği ile kenar resmi olacak resmin kaç dilime ayrılacağını belirlenebilir.

Örnek:

Bu örnek alıştırmada kenarlığa eklenecek resmin dilim sayısı değeri üzerinde oynayarak farklı kenarlık tipleri oluşturmayı deneyeceğiz.

#kenarresim1 { border: 13px solid transparent; padding: 14px; -webkit-border-image: url('border.png') round; /* Safari 3.1-5 */ -o-border-image: url('border.png') round; /* Opera 11-12.1 */ border-image: url('border.png') round; border-image-slice: 50; }

CSS border-image-slice nedir nasıl kullanılır

Css border-image-slice özelliği kenarlık için kullanılacak resmin dilim sayısını belirtmek için kullanılır.

CSS border-image-slice	CSS border-image-slice özellikleri
Varsayılan Değer:	100%
Kalıtsallık:	yok
Animasyon Özelliği:	yok
Versiyon:	CSS3
JavaScript border-image-slice:	object.style.borderImageSlice="25%"

CSS border-image-slice Tarayıcı Desteği

CSS Kodu:
border-image-slice	15.0	11.0	15.0	6.0	15.0

CSS border-image-slice Değerleri

border-image-slice:number|%|fill|initial|inherit;

CSS border-image-slice özelliği değerleri

CSS border-image-slice değerleri	CSS border-image-slice değerleri tanımları	CSS örnek uygulamalar
number	Sayısal değer girilir.
%	Yüzde olarak değer yazılır.
fill	Kullanılan resmin
initial	Varsayılan değerini alır.
inherit	Soybağından gelen değeri geçerli kılar.