日期:2014-05-17  浏览次数:20684 次

父级为relative定位子级为abloute定位,子级里面的部分图片不能显示,急!急!急!急!
html部分代码如下
HTML code
<div class="content_top_right" id="indexAd">
                <div class="indexAdBox">
                    <img src="images/index_ad.jpg" width="671" />
                    <img src="images/index_ad.jpg" width="671" />
                </div>
                <div class="adButton">
                    <a href="#"><img src="images/index_ks.jpg" /></a>
                       <a href="#"><img src="images/index_tz.jpg" /></a>
                </div>
          </div>


相关CSS代码如下
.content_top_right{width:671px; height:268px; margin:0px 5px; padding:0px; border:#d6d6d6 solid 3px; position:relative; z-index:1000; overflow:hidden;}
 .indexAdBox{margin:0px; padding:0px; position:absolute;left:0px; top:-180px;height:268px; overflow:hidden; zoom:1; z-index:0; clear:both}
 .indexAdBox a{ display:block; margin:0px; padding:0px; float:left !important; height:268px; width:671px; overflow:hidden}
 .adButton{ height:33px; width:671px; margin:0px; padding:0px; position:absolute; left:0px; bottom:0px; z-index:1200; clear:both}
 .adButton a{ display:block; float:right; margin:0px 8px; padding:0px;}
  .adButton img{ margin:0px; padding:0px; z-index:0}
关键是indexAdBox中的第一张img可以显示,但是第二张只能显示一小部分,请问是什么问题了?


------解决方案--------------------
致使.indexAdBox 实际显示高度只有268-180px,overflow又设置了隐藏
------解决方案--------------------
。。。。你整个层都往上移了180个像素,而且在那个层里又加了一个overflow:hidden;当然看不到第二个图片了。
------解决方案--------------------
在子级作一个z-index:10.数据值越大谁显示在最上面第一层