border

UK[?b?:d?(r)] US[?b?:rd?(r)]

n.ボーダー; エッジ; エッジ; ラッピング エッジ

vt.& vi....の端でバインド...

vt. の端に沿って、囲む...、端...

vi近似、隣接

三人稱単數(shù): borders 複數(shù)形: borders 現(xiàn)在分詞: bordering 過去形: bordered 過去分詞: bordered

image

英[ ??m?d?] 美[??m?d?]

##n.イメージ; ポートレート; コンセプト、意図; 鏡像、イメージ

vt. 反映; 想像; イメージ; シンボル

三人稱単數(shù)形: 畫像 複數(shù)形: 畫像 現(xiàn)在分詞: イメージング 過去形: imaged 過去分詞: imaged

repeat

英[r??pi:t] 美[r??pit]

vt. 繰り返す; 再語る、暗唱する

vi. やり直す; 投票を繰り返す

n. 繰り返す; (プログラム) 再現(xiàn); 繰り返されるもの

三人稱単數(shù): 繰り返す複數(shù)形: 繰り返します 現(xiàn)在分詞: 繰り返します 過去形: 繰り返します 過去分詞: 繰り返します

css border-image-repeat屬性 構(gòu)文

関數(shù): 畫像の境界線を繰り返すか、伸ばすか、丸くするかを指定します。

構(gòu)文: border-image-repeat:stretch|repeat|round;

説明: stretch は畫像を引き伸ばして、エリアリピート 畫像をタイル狀(繰り返し)にしてエリアを埋めます。 Round は繰り返し値と似ています。すべての畫像を完全に並べることができない場合、畫像は領(lǐng)域に合わせて拡大縮小されます。

注: このプロパティは、境界線イメージの端と中央を拡張してレイアウトする方法を指定します。したがって、2 つの値を指定できます。 2 番目の値を省略した場合は、最初の値と同じ値が取得されます。

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>

インスタンスの実行 ?

[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します