border-image-repeat プロパティ
border-image-repeat プロパティは、画像を border として利用できる CSS プロパティのひとつで、画像の繰り返しを指定するプロパティです。
表示するためには border を設定しなければなりません。
関連するプロパティにはborder-image、border-image-slice 、border-image-source 、border-image-outset 、border-image-width があります。
ページ内 Index
構文(Syntax)
border-image-repeat プロパティの構文です。
CSS
DOM ( JavaScript )
値(Values)
以下は border-image-repeat プロパティに指定できる値です。
Value | 摘要 |
---|---|
stretch | 初期値、領域を埋めるように画像を引き伸ばし表示 |
repeat | 領域を埋めるように画像を繰り返し表示 |
round | 領域を埋めるように画像を整数倍で繰り返し表示 |
initial | 初期値に戻す |
inherit | 親エレメントのプロパティを継承 |
備考(Remarks)
border-image-repeat プロパティの備考です。
初期値(Default value) | stretch |
継承(Inherited) | no |
変化(Animatable) | 離散 |
変化(Animatable)の離散
はアニメーションの進捗が 50% で変化します。徐々に変化するようなアニメーションには見えません。
Example
border-image-repeat プロパティの例です。
border-image-repeat プロパティは、画像を border として利用する場合にその繰り返しを指定するプロパティです。
表示するためには border を設定しなければなりません。
以下の例では、素材Goodの画像を利用させていただきました。
関連するプロパティ
以下は関連するプロパティです。
border-image | border-imageに関するプロパティを一括定義 |
border-image-outset | 外側への表示範囲 |
border-image-repeat | 繰り返し |
border-image-slice | 元画像の利用範囲 |
border-image-source | 画像ソースのURL |
border-image-width | 幅の指定 |