DANH MỤC: Nền và Viền

Thuộc tính border-image-repeat trong CSS


Cú Pháp

-Thuộc tính này có tác dụng thiết lập xem ảnh viền (border-image) được lặp như thế nào hoặc làm tròn hay kéo dãn.

Cú Pháp:

border-image-repeat: value;

Trong đó, value là một trong các giá trị sau:

  • stretch - kéo dãn (đây là giá trị mặc định).
  • repeat - lặp lại.
  • round - làm tròn.

Ví Dụ

VD:

.border{
    border:35px solid transparent;
    border-image-source: url(border.png);
    height: 300px;
    border-image-slice: 170;
    border-image-width: 15px;
    border-image-repeat: stretch;
}
.border2{
    border:35px solid transparent;
    border-image-source: url(border.png);
    height: 300px;
    border-image-slice: 20%;
    border-image-width: 25px;
    border-image-repeat: round;
}
.border3{
    border:35px solid transparent;
    border-image-source: url(border.png);
    height: 300px;
    border-image-slice: 20%;
    border-image-width: 25px;
    border-image-repeat: repeat;
}

Xem Kết Quả

Nguồn: Toidicode.com

Thông tin tác giả

Vũ Thanh Tài

Vũ Thanh Tài

Biển học vô biên, quay đầu là dại!

Hãy tham gia group facebook để cùng giao lưu chia sẻ kiến thức! Tham Gia