0

divだから私は の背景画像のサイズを変更したかったので、を 100%background-size: containに設定しました。width画面のサイズが変化するモバイル サイトに必要です。ただし、高さを設定するときにジレンマがあります。

高さをピクセル単位で設定すると、画像が小さくなると、画像の下に空白が残ります。

高さを設定しないと、画像がまったく表示されません。

これに対する最善の解決策は何ですか？

これが私のコードです：

<div id="container">
    <p>Some text</p>
    <div id="my-picture"></div>
</div>

CSS:

#container {
    width: 100%;
}
#my-picture {
    background:url(somepic.jpg) no-repeat;
    background-size: contain;
    height: ???
}
4

1 に答える 1

1

W3Schoolsによると、Background-size：cover;を使用する必要があります。

#my-picture {
  background:url(somepic.jpg) no-repeat;
  background-size: cover;
  height: ???
}
于 2012-12-27T19:43:00.307 に答える