ボタンや矩形などの要素にシャドウを付ける時は「box-shadow」が便利ですが、1色または重ねても全体が均一のカラーでしかシャドウを適用することができません。 2色の美しいCSSグラデーションでシャドウを適用するPure CSSの実装を紹介します。 Gradient shadow in pure CSS デモ 実装 デモ まずは、実際の動作から見てましょう。 2色の美しいグラデーションを伴ったシャドウは、ボタンのノーマル時・ホバー時・アクティブ時のそれぞれで異なります。
![[CSS]こんなやり方があるとは!ボタンのシャドウに2色の美しいグラデーションを与えるテクニック](https://cdn-ak-scissors.b.st-hatena.com/image/square/86d2bb41707585bf01592235c9d747aa9374b088/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201801%2F2018032701.jpg)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く