0

下部に背の高い画像が表示されたページがあります。ページがスクロールできないように(基本的に、より高い解像度のディスプレイがより多くの画像を表示するように)、ブラウザーの高さに基づいて切り取りたいと思います。これは次のようなものです。

<div id="container" style="height:100%;">
<div> (blah blah blah) </div>
<div id="photo"><img ...></div></div>

そして現在、imgはコンテナをオーバーフローしているため、背景はブラウザの画面と同じ大きさしかありませんが(本来あるべき姿)、imgはページの終わりを超えて続きます。画像の下部を切り取って、コンテナで止まるようにするにはどうすればよいですか?

4

2 に答える 2

1

style="overflow: hidden"これにより、コンテナからのオーバーフローがすべて遮断されます。

于 2012-06-18T23:00:15.533 に答える
0

要素を使用する代わりに、の背景を<div id="photo"></div>写真画像として設定して、画像がページ幅に合わせて拡大縮小されるようにすることもできます。

#photo {
   background: ('photo.jpg') no-repeat;
   background-size: 100% auto;
}
于 2012-06-18T23:40:53.863 に答える