《2017年7月5日 16:00 公開/更新》 画像に指定色の半透明フィルタを掛けたように見せるCSS [CSS3,イメージ,色] ウェブページ上に掲載する画像に対して、指定の色で半透明カラーフィルタを掛けたような効果を出すCSS(スタイルシート)の書き方を解説してみます。ボックスに加えた背景色を、CSS3で透明度を指定できるopacityプロパティを使って透過させるだけの簡単テクニックです。1枚の写真に様々な色の半透明カラーフィルタっぽい効果を加えられます。 画像に指定色の半透明フィルタを掛けたように見せるCSSの書き方 青色フィルタ(40%・20%)の表示例と、その効果の作り方 赤色フィルタ(40%・20%)の表示例とソース 黄色フィルタ(40%・20%)の表示例とソース 緑色フィルタ(40%・20%)の表示例とソース 紫色フィルタ(40%・20%)の表示例とソース 黒色フィルタ(40