html - このヘッダー画像を正しくスケーリングするにはどうすればよいですか?

Question

このヘッダー画像を必要なサイズにスケーリングしようとしていますが、正確に実行していません。サイトのすべてがスケーリングされていますが、画像の右側が 1 ～ 2 ピクセルずれています。

<div id="headerpic"><img style="width:100%" src="images/logo2.jpg"></div>

htmlですか

#headerpic
{
position: relative;
height: 100%;
margin-bottom: 2px;
}

CSSですか

ぶら下がっているいくつかのピクセルを除いて、問題ないように見えます。周囲の黒い境界線が原因であると思われますが、border="0" はそれを削除するために何もしません。誰にも手がかりがありますか？私はしません...

score 1 · Accepted Answer

あなたが話している境界線が画像上にある可能性がある場合は、次のようなものを入れてみてください

#headerpic img {
    border: none; 
}

あなたのCSSに。このjsfiddle の例を参照してください。

score 1 · Accepted Answer

このようなCSSを使用できます。

img {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

画像は、その親コンテナーの寸法に合わせて拡大縮小する必要があります。

webdesignerwall.comからの推奨事項

2 に答える 2