Google ve Youtube Reklamlarını Engelleyen Tarayıcı ve Uygulama İndir

CSS border-image Özelliği

CSS border-image

Css border-image özelliğini kullanarak html elemanlarının kenarlarına resim atayarak daha güzel tasarım ve sonuçlar elde edilebilir.

Örnek:

Bu örnekte border-image özelliğini 4 tane paragraf elemanına uygulanacaktır.

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

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

CSS border-image CSS border-image özellikleri  
Varsayılan Değer: none 100% 1 0 stretch  
Kalıtsallık: yok  
Animasyon Özelliği: yok  
Versiyon: CSS3  
JavaScript border-image: object.style.borderImage="url(border.png) 28 round"

CSS border-image Tarayıcı Desteği

CSS Kodu:
border-image 16.0
4.0 -webkit-
11.0 15.0
3.5 -moz-
6.0
3.1 -webkit-
15.0
11.0 -o-

CSS border-image Değerleri

border-image:source slice width outset repeat|initial|inherit;

CSS border-image özelliği değerleri

CSS border-image değerleri CSS border-image değerleri tanımları CSS örnek uygulamalar
border-image-source Kenarlık olarak kullanılacak resmin adresi girilir.  
border-image-slice kenarlık olarak kullanılan resmin dilim sayısıdır.
border-image-width Kenarlık olarak kullanılcak resmin genişliğidir.  
border-image-outset Kenarlık resminin uygulanacak elemandan ne kadar dışarısında kalacağını gösteren değerdir.  
border-image-repeat Resmin rekrar edip etmeyeceği belirtilir.
initial Özelliğin başlangıç değeridir.  
inherit Soy bağından gelen değeridir.  

Yorumlar