CSSリファレンス

border-image-sliceの意味と使い方

値の指定方法

数値

各辺から分割位置までの距離を、単位無しのピクセル数値(ラスター画像の場合)、あるいはベクター座標(ベクター画像の場合)で指定します。


パーセント値+%

各辺から分割位置までの距離を、画像のサイズに対する割合で指定します。左右の距離は幅を、上下の距離は高さを基準とします。


fill

この値を表示すると、分割した画像の中央の部分が表示されます。この指定がない場合は、中央の画像は切り捨てられて表示されません。


関連プロパティ

  • border-image-source:ボーダーに使用する画像を指定する
  • border-image-width:ボーダー画像の幅を指定したい
  • border-image-outset:ボーダー画像の領域を広げる
  • border-image-repeat:ボーダー画像の繰り返し方法を指定する