CSS でドロップシャドウをつける方法を紹介します。 例えば、CSS で要素に影をつけたいときに便利な方法です。 類似機能のボックスシャドウと比べて、ドロップシャドウは擬似要素も対象になります。 ドロップシャドウを付ける方法 ブラウザの対応状況 box-shadow じゃだめなの? ドロップシャドウを付ける方法 CSS で特定の要素にドロップシャドウを付ける方法を紹介します。 ドロップシャドウをつけるには filter プロパティの関数 drop-shadow を使用します。 実際の見た目はこんな感じです。 ベースの HTML は次の通りです。 <div class="dropshadow">ドロップシャドウ</div> CSS はこちら。 .dropshadow { position: relative; width: 240px; margin: 0 auto; padding: 15
![CSS でドロップシャドウをつける方法 - by Takumi Hirashima](https://cdn-ak-scissors.b.st-hatena.com/image/square/c1c63623091221b2a3ecffa1066318832a84d0f3/height=288;version=1;width=512/https%3A%2F%2Fhirashimatakumi.com%2Fwp%2Fwp-content%2Fuploads%2F2017%2F04%2F170421_1.jpg)