プログラミング

border-imageでボーダー画像をまとめて指定【CSS】

border-imageプロパティは、ボーダー画像に関することをまとめて指定するショートハンドプロパティです。

{border-image: -source -slice -width / -outset -repeat;}

指定できる値は各プロパティ「border-image-source」、「border-image-slice」、「border-image-width」、「border-image-outset」、「border-image-repeat」と同じで、それぞれの値を半角スペースで区切って指定します。

任意の順序で指定できますが、border-image-outsetプロパティの値は、border-image-widthプロパティの値にスラッシュ(/)で続けて指定します。

border-imageでボーダー画像を指定しています。

関連記事
border-image-sourceでボーダーに使う画像を指定【CSS】
border-image-sliceでボーダー画像の分割位置を指定【CSS】
border-image-widthでボーダー画像の幅を指定【CSS】
border-image-outsetでボーダー画像の領域を広げる【CSS】
border-image-repeatでボーダー画像の繰り返しを指定【CSS】

Leave a Comment