filterプロパティのMaskFilter()は、指定した色でマスクをかける際に使用します。
マスクをかける範囲の画像やテキスト部分が透明となり、それ以外の部分はマスク色となります。
p.sample1 {
filter:progid:DXImageTransform.Microsoft.MaskFilter(color=green);
}
p.sample2 {
filter:mask(color=green);
}
<html>
<head>
<link rel=”stylesheet” href=”sample.css”
type=”text/css”>
</head>
<body>
<p>
filterプロパティを適用していない画像<br>
<img src=”https://www.htmq.com/wp-content/themes/htmq/htmq-images/kaeru.gif”>
</p>
<p class=”sample1″>
フィルタ効果MaskFilter()<br>
<img src=”https://www.htmq.com/wp-content/themes/htmq/htmq-images/kaeru.gif”>
</p>
<p class=”sample2″>
フィルタ効果MaskFilter()<br>
<img src=”https://www.htmq.com/wp-content/themes/htmq/htmq-images/kaeru.gif”>
</p>
</body>
</html>
filterプロパティを適用していない画像
フィルタ効果MaskFilter()
フィルタ効果MaskFilter()