-1

ブラウザーのサイズに応じてロゴ画像のサイズが変更されない理由を誰かが理解するのを手伝ってくれますか?

----CSS---------------------

body {
       height: 100%;
       background-color:#333;
}
#logo {
      max-width: 100%;
}
img {
     border: 0;
     max-width: 100%;
     height: auto;

}
#header-bg {
    background-image: url("header-bg.png");
    overflow: auto;
    width: 100%;
}

----------------HTML----------------------------------

 <body>
    <div id="header-bg">
    <div id="logo">
        <img src="logo.png" /> 
    </div>
   </div>
</body>
4

1 に答える 1

4

その理由は、あなたが与えmax-widthた が、元の よりも少ない可能性があるためですwidth。したがって、与えるwidthことで問題が解決します。

img {
     border: 0;
     width: 100%;
     height: auto;
}

これ以外は、すべて正しいです。

画像がそれほど大きくなく、画面の幅全体を占めていると感じた場合は、親の幅を小さくして25%ください。そして の画像widthへ100%。したがって、親は画面の幅に応じて確実に調整され、画像も調整されます。:)

于 2013-02-12T16:39:27.003 に答える