filter: mask(***);

ブラウザ
  • IE
プロパティ
  • 独自拡張プロパティ
IE10以降は未対応となりました。

mask は、マスクをかけるフィルタです。

透過部分を指定色で塗りつぶし、不透明の部分を透明にします。


.example {
filter: mask(color=#0000ff);
}

属性 値と説明
color 塗りつぶす色
(色の指定については、CSSの色指定をご覧ください)
  • このプロパティは、CSS 2では定義されていません。

使用例

フィルタなしの状態
<p><img src="example2.gif" alt="[サンプル]"></p>

[サンプル]

<div style="font: bold 170% sans-serif; width: 100%;">
フィルタの表示テスト
</div>
フィルタの表示テスト
マスク
<p><img src="example2.gif" alt="[サンプル]" style="filter: mask(color=#ffd37d);"></p>

[サンプル]

<div style="font: bold 170% sans-serif; width: 100%; filter: mask(color=green);">
フィルタの表示テスト
</div>
フィルタの表示テスト