1

次のコードがあります

HTML:

<div class="dropShadow">
    <img src="images/headerimage" />
</div>

CSS:

div.dropShadow {
    background-image: url('dropshadow.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    padding-bottom: 19px; /* the height of the shadow */
}

ただし、Firefox では問題ありませんが、Chrome や IE では、画像の下部と配置された背景画像の上部の間に小さな空白があります。周囲の空白をすべて削除しましたが、どのルールを試したらよいかわかりません。助言がありますか？

4

1 に答える 1

5

IMGにvertical-align：topまたはdisplay：blockを書き込みます。このように書いてください：

img{
 vertical-align:top;
}
于 2012-09-20T16:43:11.383 に答える