box-shadowで画像(img要素)に影を落とす - Qiita
素直にやると、img要素の上には、box-shadowでinset指定しても影が落ちません。 そこで、z-indexで調整してimg要素を下のレイヤーに持って行くと、box-shadowで影が落ちるようになります。box-shadowだけじゃなくて色々使えるテクニックです .image-box { margin-top: 100px; position: relative; z-index: 1; } .image-box .shadow { -moz-box-shadow: inset 0px 0px 12px rgba(0,0,0,.6); -webkit-box-shadow: inset 0px 0px 12px rgba(0,0,0,.6); box-shadow: inset 0px 0px 12px rgba(0,0,0,.6); } .image-box .shadow i
ぼくのかんがえたさいきょうのあんどろいど: cssのみでボーダーを内側に引く方法
2013/02/01 cssのみでボーダーを内側に引く方法 忘れてboderでやってしまいそうなので、メモ。a:hover{ -webkit-box-shadow: inset 0px -4px 0px 0px #333333; box-shadow: inset 0px -4px 0px 0px #333333; } これで内側に下線が引けるじゃなイカ？ Spreadを指定すれば四方に線分を指定できるはず。 IE8…。 -moz-は必要なくなってたのね…。最近気がついた…。 ちなみに今までは borderをcssで設定する際、内側・外側どちらに表示されるのか？ <div style=”whidt:300px”> <div style=”border-bottom:solid 4px #000000”> 二段構えでやってた。 </div></div> 他に http://css-trick
Image Rollover Borders That Do Not Change Layout
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! It’s a fact of CSS life that the ‘border’ of any block level element gets factored into its final box size for layout. That means that if you add a border on a hover to an element that didn’t already have a border of that exact size, you will cause a layout shift. It’s one of my pet peeves,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
Firefoxで、検索結果やブックマークを新しいタブで開く方法 - O・SU・SO・WA・KE
