Home > MT4 > CSSで画像にドロップシャドウをつける

CSSで画像にドロップシャドウをつける

2009-02-04 (水) 18:30
MT4
CSS | MT4 | ドロップシャドウ

ブログの投稿画像に影をつける為のメモ。
修正する時に忘れない為にね。

利用にしたのは
小粋空間: CSSで画像に影をつける（ドロップシャドウ）

画像に影をつけて回り込みをさせるCSSなので、回り込み解除を加えて終了。

.shadow {
    margin: 10px 0 0 5px;
    background: url(背景画像へのパス) right bottom;
    float: left; /* 回り込み制御 */
}

.shadow img {
    position: relative;
    left: -5px; /* 画像を左へ移動 */
    top: -5px; /* 画像を上へ移動 */
    padding: 5px; /* 画像枠 */
    background: #ffffff; /* paddingを設定した場合の背景色 */
    border: 1px solid #999999; /* 画像の枠線 */
}

.clear {
    display: block;
    clear: both;
}

回り込みをさせない場合は、別にクラスを用意してやればOKかな。

Popularity: 15% [?]

コメント:0

トラックバック:0

このエントリーのトラックバックURL: http://blog.sanoya.com/2009/02/css.php/trackback
Listed below are links to weblogs that reference: CSSで画像にドロップシャドウをつける from 佐野屋よろず帳

Home > MT4 > CSSで画像にドロップシャドウをつける

カレンダー

最近のコメント

アーカイブ

LINK