0
<div id="show01">
<img src="https://www.google.com/images/srpr/logo4w.png">
<img src="https://www.google.com/images/srpr/logo4w.png">
<img src="https://www.google.com/images/srpr/logo4w.png">
</div>

<div id="content"></div>

CSS

#show01{ 
    margin-top:14px; 
    position: relative;
    height:auto;
    border:thin solid blue;
}
#show01 img { 
  position: absolute;
    max-width:70%;
}
#content{
    background:#999;
    height:45px;
}

imgposition:absoluteそれらはjqueryスライドショーの対象であるためです。

ただし、その場合、divには高さがないcontentため、div はページの上部に移動します。#show01上の青い線だけです。

では、どうすればimgを保持position:absoluteし、内部show01として高さを持たせることができますか.img

show01レスポンシブ レイアウトを維持しているため、div の高さをピクセル単位で定義できません。

フィドルはこちら

4

1 に答える 1

1

これはセミハック(っぽい)ですが、 のマージンを設定できます#show01

試してみてくださいmargin-bottom:24%;..例を見て、これがあなたが目指していたものかどうか教えてください。

基本的に、指定されていない高さを置き換えるために、画像のサイズに等しいマージンを設定する必要があります.ブラウザのサイズを変更すると、応答性が高くなるようです..

于 2013-08-26T19:15:16.493 に答える