7

ウェブサイト上のすべての画像のスタイルを設定して、ボックスシャドウと10ピクセルのパディングを設定し、テキストが画像に対して滑らかにならないようにします。ただし、CSSを使用して「img」にパディングを割り当てると、パディングの端にボックスシャドウが描画され、画像の周囲に10ピクセルの空白が残ります。

#content img {
    -moz-box-shadow: 0 0 5px 2px #282a2d;
    -webkit-box-shadow: 0 0 5px 2px #282a2d;
    padding:10px
}

この特定の画像は、段落内に左に浮かんでいます。これが私の問題の例です-

ここに画像の説明を入力してください

何か案は?

編集:私はパディングを望んでいません。ボックスシャドウのすぐ隣にテキストがマッシュアップされないように、ボックスシャドウ、次にスペースが必要です。私が欲しかったのは、パディングではなくマージンでした。愚かな間違い。

4

2 に答える 2

4

marginに加えて使用するpadding

#content img {
    box-shadow: 0 0 5px 2px #282a2d;
    padding: 10px;
    margin-right: 10px;  
}
于 2012-04-16T05:17:02.710 に答える
0

同じ色の背景を与える

#content img {
    -moz-box-shadow: 0 0 5px 2px #282a2d;
    -webkit-box-shadow: 0 0 5px 2px #282a2d;
    background: #282a2d;
    padding:10px;
}

デモ


アップデート:

コメントで述べたように、OPはパディングなしでもOKのようです。だから、私は私の答えを完成させます。

#content img {
    -moz-box-shadow: 0 0 5px 2px #282a2d;
    -webkit-box-shadow: 0 0 5px 2px #282a2d;
    margin:10px
}
于 2012-04-16T05:17:48.350 に答える