CSS border-image-sourceคุณสมบัติ
ตัวอย่าง
ระบุรูปภาพเป็นเส้นขอบรอบองค์ประกอบ:
#borderimg
{
border-image-source: url(border.png);
}
ความหมายและการใช้งาน
คุณสมบัติborder-image-source
ระบุพาธไปยังรูปภาพเพื่อใช้เป็นเส้นขอบ (แทนที่จะเป็นเส้นขอบปกติรอบองค์ประกอบ)
เคล็ดลับ:หากค่าเป็น "ไม่มี" หรือหากไม่สามารถแสดงรูปภาพได้ ระบบจะใช้ลักษณะเส้นขอบ
เคล็ดลับ:ดูคุณสมบัติborder-imageด้วย (คุณสมบัติชวเลขสำหรับการตั้งค่าคุณสมบัติ border-image-* ทั้งหมด)
ค่าเริ่มต้น: | ไม่มี |
---|---|
รับการถ่ายทอด: | ไม่ |
เคลื่อนไหวได้: | ไม่. อ่านเกี่ยวกับแอนิเมชั่น |
รุ่น: | CSS3 |
ไวยากรณ์ JavaScript: | วัตถุ .style.borderImageSource="url(border.png)" |
รองรับเบราว์เซอร์
ตัวเลขในตารางระบุเบราว์เซอร์รุ่นแรกที่สนับสนุนคุณสมบัติอย่างสมบูรณ์
Property | |||||
---|---|---|---|---|---|
border-image-source | 15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
ไวยากรณ์ CSS
border-image-source: none|image|initial|inherit;
มูลค่าทรัพย์สิน
Value | Description |
---|---|
none | No image will be used |
image | The path to the image to be used as a border |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
หน้าที่เกี่ยวข้อง
กวดวิชา CSS: CSS Border Images
การอ้างอิง CSS: คุณสมบัติ border-image
การอ้างอิง CSS: border-image-outset คุณสมบัติ
การอ้างอิง CSS: border-image-repeat คุณสมบัติ
การอ้างอิง CSS: border-image-slice คุณสมบัติ
การอ้างอิง CSS: คุณสมบัติ border-image-width
การอ้างอิง HTML DOM: borderImageSource คุณสมบัติ