CSSリファレンス

Tweet

border-imageはボーダー画像を指定するためのプロパティです。

このプロパティでborder-image-source、border-image-slice、border-image-width、border-image-outset、border-image-repeatの値をまとめて指定することができます。

.target{
	width:27px;
	height:27px;
	border: 27px solid orange;
	border-image:url("/sample/images/border.png") 27  / 1 round;
}

sample

対応ブラウザ

◯は実装済み、△はベンダープレフィックス付の実装、☓は未実装です。

参考URL

6.7. Border Image Shorthand: the ‘border-image’ property - CSS3 - W3C

登録日 : 2014年07月21日 最終更新日 : 2014年7月21日

同じカテゴリー(Border)のエントリー

• border
• border-left
• border-bottom
• border-right
• border-top
• border-image
• border-image-repeat
• border-image-outset
• border-image-width
• border-image-slice
• border-image-source
• border-radius
• border-bottom-left-radius
• border-bottom-right-radius
• border-top-right-radius
• border-top-left-radius
• border-left-width
• border-bottom-width
• border-right-width
• border-top-width
• border-width
• border-left-style
• border-bottom-style
• border-right-style
• border-top-style
• border-style
• border-left-color
• border-bottom-color
• border-right-color
• border-top-color
• border-color