CSSでpng、svg画像に影をつける
単にpng画像に影をつける場合
img {
box-shadow: 4px 4px 4px #808080;
}
のようにCSSを書くと
が、
となる。
参考：CSS リファレンス - CSS: カスケーディングスタイルシート | MDN
今回、新たに知って、便利だったのが、
filter: drop-shadow()
これは、画像そのものに影をつけることができる。
img {
filter: drop-shadow(4px 4px 4px #808080);
}
わお。
現時点で、IEはNot supported。
Can I use
参考：CSS リファレンス - CSS: カスケーディングスタイルシート | MDN
ちなみに、png、svgファイルで使えるのを確認した。