CSS3

プロパティ

mask-border-source

  編集:2022.07.14 by T.A.

mdn

マスク ボーダー画像源。

名前 mask-border-source
none | <image>
初期値 none
適用対象 mask-image と同じ
継承 されない
百分率 受容しない
算出値 キーワード none/算出 <image>
正準的順序 文法に従う
アニメーション型 離散的

マスク ボーダー画像 として利用される画像を指定する。

次に該当する画像は、無視され、要素をマスクしない ― それでも、マスク ボーダー画像として数えられるが:

空画像である(横幅または縦幅が 0)/
ダウンロードに失敗した/
存在しない/
表示できない(例:サポートされる画像形式でない)

マスク ボーダー画像を処理する方法は、マスクの処理法を見よ。

算出値が none 以外になる場合 ― opacity の値が 1 未満のときと同じ仕方で ― 積層文脈 を作成させる。[CSS21]

[mask-border-source、mask-image]は、互いに独立に指定できる。両プロパティとも none 以外の値をとる場合、要素は、両マスク法演算により順にマスクされる。

注記: mask-image、mask-border-source どちらの演算を先に適用しようが、描画した結果は同じになる。

none
<image>

テスト
HTML:

ここに表示
¶[Edge]✖?
HTML:

ここに表示
スクリプト:


スクリプト:



表示内容:
表示内容: