CSS border-image-source | CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル

border-image-source CSS プロパティとは

トピック:ボーダスタイルのプロパティによって与えられるボーダスタイルの代わりに、ボーダに使用されるイメージの場所を指定(境界線として使用される画像へのパスを指定)する、ことができる 、値が「none」の場合、又は 、画像を表示できない場合は、境界線スタイルが 使用 される

プロパティ border-image-source

実例 コード 1

サンプル コードを試す
     #webref{
        border-image-source: url("../webref.jpg");
    }

プロパティ 定義と使用法

デフォルト値・初期値 :none
適用対象 :全要素。ただし border-collapsecollapse のときはテーブル要素内部にあるものを除く。 ::first-letter にも適用される
継承 :不可
メディア :visual
計算値 :none または画像の絶対的 URI
CSS Version CSS3
アニメーションの種類 :個別
JavaScript 構文 object.style.borderImageSource="url("../webref.jpg")"
正規順序 :形式文法で定義される一意のあいまいでない順序
CSSの構文border-image-source: none |image |initial |inherit;

プロパティ値

説明
none画像は使用されません
image境界として使用されるイメージへのパス
initialこのプロパティをデフォルト値に設定する
inherit親要素からこのプロパティを継承する

サポートするデスクトップ ブラウザ対応・互換性

PropertyDesktop 互換性
border-image-sourceChromeEdgeFirefoxInternet ExplorerOperaSafari
基本 サポートフルサポート◯15フルサポート◯12フルサポート◯15フルサポート◯11フルサポート◯15フルサポート◯6

サポートするモバイル ブラウザ対応・互換性

PropertyMobile 互換性
border-image-sourceAndroidChrome for Android
Edge MobileFirefox for Android
Opera for Android
iOS SafariSamsung Internet
基本 サポート 不明 不明フルサポート◯ありフルサポート◯15 不明 不明 不明
border-image-source 関連記事
CSS border-image-source | CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル
CSS border-image-source| CSS プロパティ 値| 意味 使い方 実例 – WebRef
あわせて読みたい

Html

Glossary

PHP

JavaScript

JQuery

CSS