CSS border-image-slice Özellik
Örnek
Kenarlık görüntüsünün nasıl dilimleneceğini belirtin:
#borderimg {
border-image-slice: 30%;
}
Tanım ve Kullanım
Özellik , border-image-sourceborder-image-slice
tarafından belirtilen görüntünün nasıl dilimleneceğini belirtir
. Görüntü her zaman dokuz bölüme ayrılır: dört köşe, dört kenar ve orta.
"Orta" kısım, fill anahtar sözcüğü ayarlanmadıkça tamamen şeffaf olarak değerlendirilir.
İpucu: Ayrıca border-image özelliğine de bakın (tüm border-image-* özelliklerini ayarlamak için bir kestirme özellik).
Varsayılan değer: | 100% |
---|---|
Miras: | Hayır |
canlandırılabilir: | Hayır. Canlandırılabilir hakkında bilgi edinin |
Sürüm: | CSS3 |
JavaScript sözdizimi: | nesne .style.borderImageSlice="%30" |
Tarayıcı Desteği
Tablodaki sayılar, özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Property | |||||
---|---|---|---|---|---|
border-image-slice | 15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
CSS Sözdizimi
border-image-slice: number|%|fill|initial|inherit;
Not: Özellik border-image-slice
bir ile dört arasında değer alabilir. Dördüncü değer atlanırsa, ikinci ile aynıdır. Üçüncüsü de atlanırsa, ilkiyle aynıdır. İkincisi de atlanırsa, ilkiyle aynıdır.
Mülk değerleri
Value | Description | Play it |
---|---|---|
number | The number(s) represent pixels for raster images or coordinates for vector images | |
% | Percentages are relative to the height or width of the image | |
fill | Causes the middle part of the image to be displayed | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
İlgili Sayfalar
CSS eğitimi: CSS Kenarlık Resimleri
CSS Referansı: border-image özelliği
CSS Referansı: border-image-outset özelliği
CSS Referansı: border-image-repeat özelliği
CSS Referansı: border-image-source özelliği
CSS Referansı: border-image-width özelliği
HTML DOM referansı: borderImageSlice özelliği