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

Thuộc tính border-image-outset trong CSS3


Cú Pháp

-Thuộc tính này có tác dụng thiết lập chiều rộng viền ảnh (border-image) đổ ra phía bên ngoài thành phần.

Cú Pháp:

border-image-ouset: value;

Trong đó: value có thể là 1, 2, 3, 4 giá trị với chức năng tương tự như thuộc tính margin padding. Mặc định thì thuộc tính có giá trị bằng 0.

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;
        border-image-outset: 10px;
    }
    .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;
        border-image-outset: 10px 15px;
    }
    .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;
        border-image-outset: 15px 20px 35px 30px;
    }

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