Thuộc tính CSS border-image-outset
Ví dụ
Đặt hình ảnh viền 10 pixel bên ngoài các cạnh viền của một phần tử:
#borderimg
{
border-image-source: url(border.png);
border-image-outset: 10px;
}
Hãy tự mình thử »Định nghĩa và cách sử dụng
Thuộc tính border-image-outset
chỉ định mức độ mà vùng hình ảnh viền mở rộng ra ngoài hộp viền.
Mẹo: Ngoài ra, hãy xem thuộc tính border-image (thuộc tính tốc ký để đặt tất cả các thuộc tính border-image-*).
Giá trị mặc định: | 0 |
---|---|
Thừa hưởng: | KHÔNG |
Hoạt hình: | KHÔNG. Đọc về hoạt hình |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | đối tượng .style.borderImageOutset="10px"Hãy dùng thử |
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
Property | |||||
---|---|---|---|---|---|
border-image-outset | 15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
Cú pháp CSS
border-image-outset: length | number |initial|inherit;
Lưu ý: Thuộc tính border-image-outset
có thể nhận từ một đến bốn giá trị (cạnh trên, phải, dưới và trái). Nếu giá trị thứ tư bị bỏ qua, nó sẽ giống giá trị thứ hai. Nếu cái thứ ba cũng bị bỏ qua thì nó cũng giống như cái thứ nhất. Nếu cái thứ hai cũng bị bỏ qua thì cái thứ nhất cũng giống như vậy.
Giá trị tài sản
Value | Description | Play it |
---|---|---|
length | A length unit specifying how far from the edges the border-image will appear. Default value is 0 | Demo ❯ |
number | Represent multiples of the corresponding border-width | Demo ❯ |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Trang liên quan
Hướng dẫn CSS: Hình ảnh viền CSS
Tham khảo CSS: thuộc tính hình ảnh viền
Tham khảo CSS: thuộc tính lặp lại hình ảnh viền
Tham khảo CSS: thuộc tính border-image-slice
Tham khảo CSS: thuộc tính nguồn hình ảnh viền
Tham khảo CSS: thuộc tính border-image-width
Tham chiếu DOM HTML: thuộc tính borderImageOutset