CSS3 border-image-repeat ÊôÐÔ
ʵÀý
¹æ¶¨ÈçºÎÖØ¸´Í¼Ïñ±ß¿ò£º
div
{
border-image-source: url(border.png);
border-image-repeat: round;
}
ä¯ÀÀÆ÷Ö§³Ö
IE | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|
Opera ²»Ö§³Ö border-image-repeat ÊôÐÔ¡£
Internet Explorer 10 ÒÔ¼°¸üÔçµÄ°æ±¾²»Ö§³Ö border-image-repeat ÊôÐÔ¡£
Safari 5 ÒÔ¼°¸üÔçµÄ°æ±¾²»Ö§³Ö border-image-repeat ÊôÐÔ¡£
Çë²ÎÔÄ border-image ÊôÐÔ¡£
¶¨ÒåºÍÓ÷¨
border-image-repeat ÊôÐԹ涨ͼÏñ±ß¿òÊÇ·ñÓ¦¸Ã±»Öظ´£¨repeated£©¡¢ÀÉ죨stretched£©»òÆÌÂú£¨rounded£©¡£
ĬÈÏÖµ£º | stretch |
---|---|
¼Ì³ÐÐÔ£º | no |
°æ±¾£º | CSS3 |
JavaScript Óï·¨£º | object.style.borderImageRepeat="round" |
¿ÉÄܵÄÖµ
border-image-repeat: stretch|repeat|round;
×¢ÊÍ£º¸ÃÊôÐԹ涨ÈçºÎÑÓÕ¹ºÍÆÌÅű߿òͼÏñµÄ±ßÔµºÍÖм䲿·Ö¡£Òò´Ë£¬Äú¿ÉÒԹ涨Á½¸öÖµ¡£Èç¹ûÊ¡ÂÔµÚ¶þ¸öÖµ£¬Ôò²ÉÈ¡ÓëµÚÒ»¸öÖµÏàͬµÄÖµ¡£
Öµ | ÃèÊö |
---|---|
stretch | ÀÉìͼÏñÀ´Ìî³äÇøÓò |
repeat | ƽÆÌ£¨Öظ´£©Í¼ÏñÀ´Ìî³äÇøÓò¡£ |
round | ÀàËÆ repeat Öµ¡£Èç¹ûÎÞ·¨ÍêÕûƽÆÌËùÓÐͼÏñ£¬Ôò¶ÔͼÏñ½øÐÐËõ·ÅÒÔÊÊÓ¦ÇøÓò¡£ |
Ïà¹ØÒ³Ãæ
CSS3 ½Ì³Ì£ºCSS3 ±ß¿ò