border
英 [?b?:d?(r)]? ?美 [?b?:rd?(r)]??
n.邊界;邊;鑲邊;包邊
vt.& vi.與…接界,在…的邊上
vt.沿…的邊,環(huán)繞…,給…鑲邊
vi.近似,毗鄰
第三人稱單數(shù): borders 復(fù)數(shù): borders 現(xiàn)在分詞: bordering 過去式: bordered 過去分詞: bordered
image
英 [??m?d?]? ?美 [??m?d?]??
n.影像;肖像;概念,意向;鏡像,映像
vt.反映;想像;作…的像;象征
第三人稱單數(shù): images 復(fù)數(shù): images 現(xiàn)在分詞: imaging 過去式: imaged 過去分詞: imaged
repeat
英 [r??pi:t]? ?美 [r??pit]??
vt.重復(fù);復(fù)述,背誦
vi.重做;重復(fù)投票
n.重復(fù);(節(jié)目)重演;重復(fù)的事物
第三人稱單數(shù): repeats 復(fù)數(shù): repeats 現(xiàn)在分詞: repeating 過去式: repeated 過去分詞: repeated
css border-image-repeat屬性 語(yǔ)法
作用:規(guī)定圖像邊框是否應(yīng)該被重復(fù)(repeated)、拉伸(stretched)或鋪滿(rounded)。
語(yǔ)法:border-image-repeat: stretch|repeat|round;
說明:stretch拉伸圖像來(lái)填充區(qū)域repeat平鋪(重復(fù))圖像來(lái)填充區(qū)域。round類似 repeat 值。如果無(wú)法完整平鋪所有圖像,則對(duì)圖像進(jìn)行縮放以適應(yīng)區(qū)域。
注釋:該屬性規(guī)定如何延展和鋪排邊框圖像的邊緣和中間部分。因此,您可以規(guī)定兩個(gè)值。如果省略第二個(gè)值,則采取與第一個(gè)值相同的值。
css border-image-repeat屬性 示例
<!DOCTYPE html> <html> <head> <style> div { background-color: lightgrey; border: 30px solid transparent; border-image: url('http://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg'); border-image-slice: 30; border-image-repeat: repeat; } </style> </head> <body> <div> DIV 使用圖像邊框。 </div> <p>使用的圖片:</p> <img src="http://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg"> <p><b>注意: </b>Internet Explorer 10, Opera 12, 和 Safari 5 不支持 border-image-repeat 屬性。</p> </body> </html>
運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例