CSS border-image-repeatคุณสมบัติ
ตัวอย่าง
ระบุวิธีการทำซ้ำภาพเส้นขอบ:
#borderimg
{
border-image-source: url(border.png);
border-image-repeat: repeat;
}
ความหมายและการใช้งาน
คุณสมบัติborder-image-repeat
ระบุว่าควรทำซ้ำรูปภาพเส้นขอบ ปัดเศษ เว้นระยะ หรือขยาย
เคล็ดลับ:ดูคุณสมบัติborder-imageด้วย (คุณสมบัติชวเลขสำหรับการตั้งค่าคุณสมบัติ border-image-* ทั้งหมด)
ค่าเริ่มต้น: | ยืด |
---|---|
รับการถ่ายทอด: | ไม่ |
เคลื่อนไหวได้: | ไม่. อ่านเกี่ยวกับแอนิเมชั่น |
รุ่น: | CSS3 |
ไวยากรณ์ JavaScript: | วัตถุ .style.borderImageRepeat="รอบ" |
รองรับเบราว์เซอร์
ตัวเลขในตารางระบุเบราว์เซอร์รุ่นแรกที่สนับสนุนคุณสมบัติอย่างสมบูรณ์
Property | |||||
---|---|---|---|---|---|
border-image-repeat | 15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
ไวยากรณ์ CSS
border-image-repeat: stretch|repeat|round|space|initial|inherit;
หมายเหตุ:คุณสมบัตินี้ระบุว่ารูปภาพสำหรับด้านข้างและส่วนตรงกลางของรูปภาพขอบถูกปรับขนาดและเรียงต่อกันอย่างไร ดังนั้น คุณสามารถระบุค่าสองค่าได้ที่นี่ หากละค่าที่สอง จะถือว่าเหมือนกับค่าแรก
มูลค่าทรัพย์สิน
Value | Description | Play it |
---|---|---|
stretch | Default value. The image is stretched to fill the area | |
repeat | The image is tiled (repeated) to fill the area | |
round | The image is tiled (repeated) to fill the area. If it does not fill the area with a whole number of tiles, the image is rescaled so it fits | |
space | The image is tiled (repeated) to fill the area. If it does not fill the area with a whole number of tiles, the extra space is distributed around the tiles | |
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-slice คุณสมบัติ
การอ้างอิง CSS: border-image-source property
การอ้างอิง CSS: คุณสมบัติ border-image-width
การอ้างอิง HTML DOM: borderImageRepeat คุณสมบัติ