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 place-self Kullanımı

CSS font-style Kullanımı

CSS hyphens Kullanımı

CSS text-decoration-color Kullanımı

CSS border-spacing Kullanımı