知名度が低いウェブ標準ひとり Advent Calendar 2021 – 04 日目 今日は普通に便利な filter: drop-shadow() です。 box-shadow や text-shadow のように影を落とすことができる CSS の機能ですが、画像の場合透過部分を落としてよしなにやってくれるところが魅力です。 filter – CSS: カスケーディングスタイルシート | MDN デモ:https://codepen.io/ginpei/pen/zYdmMVE 基本的な使い方 box-shadow はプロパティでしたが、drop-shadow() は filter プロパティの値として使える <filter-function> です。
![filter: drop-shadow()(知名度が低いウェブ標準ひとりAdvent Calendar 2021 – 04日目) | Ginpen.com](https://cdn-ak-scissors.b.st-hatena.com/image/square/6a70789e8d4dd4055b8569f9f1b5b86714f02648/height=288;version=1;width=512/https%3A%2F%2Fginpen.com%2Fwp-content%2Fuploads%2F2021%2F11%2Fdrop-shadow.png)