CSS border-image-slice

border-image-slice

border-image-slice özelliği, border ‘ ın belirtilen boyutlar içinde tekrarlanmasını sağlar.

Örnek

border: 10px solid transparent;
    padding: 15px;
    -webkit-border-image: url(http://w3tr.com/file/border.png) round; /* Safari 3.1-5 */
    -o-border-image: url(http://w3tr.com/file/border.png) round; /* Opera 11-12.1 */
    border-image: url(http://w3tr.com/file/border.png) round;
    border-image-slice: 20%;

Codepen Ön izleme

See the Pen <a href='http://codepen.io/w3tr/pen/Kzbdor/'>CSS border-image-slice</a> by W3TR (<a href='http://codepen.io/w3tr'>@w3tr</a>) on <a href='http://codepen.io'>CodePen</a>.<br />

Css Sözdizimi

Değer	Açıklama	Örnek
stretch	Varsayılan değer. Görüntü alanını kaplayacak şekilde genişletilir.
repeat	Görüntü alanını sınırlanan bölge kadar tekrar eder.
round	Görüntünün iki noktası arasındaki bölgesi tekrarlanmasını sağlar.
initial
inherit

“CSS border-image-slice” üzerine bir yorum

Geri bildirim: CSS border-image | W3TR

Bir cevap yazın Cevabı iptal et