filter プロパティ
プロパティ filter は、
背景画像に特定の芸術的スタイルや
フィルターを設定します。このプロパティは、
値として、filter 関数で形成される芸術的スタイルの名称
または none（選択したフィルターの
解除）を取ることができます。
構文
セレクター {
filter: 芸術的スタイル または none;
}
例
画像に白黒フィルターを設定し、 ホバー時にそれを解除してみましょう：
<div id="elem"></div>
#elem {
filter: grayscale(100%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
#elem:hover {
filter: none;
}
:
関連項目
-
プロパティ
background,
背景に関する一括指定プロパティ -
関数
blur,
背景をぼかします -
関数
brightness,
背景の明るさを設定します -
関数
contrast,
背景のコントラストを設定します -
関数
drop-shadow,
背景に影を設定します -
関数
hue-rotate,
背景の色相を設定します -
関数
invert,
背景色を反転します -
関数
opacity,
背景の透明度を設定します -
関数
sepia,
背景をセピア調に変換します
