ボックスの1辺だけに影をつける | Nuta.log
CSS3で追加されたbox-shadowを用いてボックスの1辺だけに影をつけたいと思います。 ※box-shadow対応ブラウザでご覧ください。 ぼかしの大きさが0の影の場合 単純に影を延ばす方向に影をずらすだけです。 box-shadow: 0 8px 0 #ccc; 右辺だけに影 ぼかしの大きさが0より大きい影の場合 上記と同じようにやると、ぼかした分影がボックスより大きくなっているため、他の辺からも影がはみ出てしまいます。 そこで、box-shadowに”影の広がり”の値を追加することによって影を小さくしてやります。この値は0の場合は省略してしまうのであまり見かけませんが、”ぼかしの大きさ”の後ろに指定します。 box-shadow: 0 9px 12px -9px #222; このように”影の広がり”に”影の大きさ”にネガティブ値を指定することによって、他の辺から影がはみ出なくなり
Animated Media Queries | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! If you apply a transition on an element for a particular supported property, and that property ever changes, it will use that transition. If a class name on that element changes and the new class changes that property, it will transition (assuming what that class does isn’t remove the transi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
