CSS border-image-slice Kullanımı

CSS "border-image-slice" özelliği, resim kullanarak bir elementin border'ını oluşturmak için kullanılır. Bu özellik, resimdeki bölgeleri belirli bir şekilde böler ve elementin border'ını oluşturur.

Aşağıdaki örneği inceleyelim..

div {
  border-image-slice: 30;
  border-image-source: url('border.png');
  border-image-width: 10px;
  border-image-outset: 10px;
  border-image-repeat: repeat;
}

Örnekte verilen border-image-slice: 30; ifadesi, "border.png" resmini 30 piksel genişliğinde böler. Yani resimdeki 30 piksel genişliğindeki bölge border olarak kullanılacaktır. Bu bölgenin dışındaki kısımlar kullanılmayacak, bu şekilde border'ın daha doğal görünmesi sağlanacak ve daha az tekrarlama olacaktır.


CSS

İlginizi Çekebilir

CSS caption-side Kullanımı

CSS color-profile Kullanımı

CSS opacity Kullanımı

CSS font-style Kullanımı

CSS z-index Kullanımı