.main{width:95%;margin-top:0px;background-color:#F1F1F1;overflow:hidden;}
.gtpic{line-height:0;}
.pic{overflow:hidden;}
.gttextwz{background:url(//url) repeat-x;font-size:18px;font-weight: bold;color: #FFF;height: 30px;width:100%;position: relative;top: -30px;
line-height:30px;z-index:100;}
///////////////////////////////////////////////////////////////////////////////
<div id="main" class="main">
<div class="pic" id="pic" style="background-color:#0F6;">
<div align="center" id="picArea" class="gtpic"><img width="100%" height="100%" name="uri" alt="Loading..." src="//src" id="showPic"></div>
<div align="center" id="textArea" class="gttextwz">打破传统综合性曲艺大杂烩</div>
</div>
</div>
文字条浮上去后为什么绿色没有overflow:hidden;掉？

- - 相对定位会保留元素占用的位置，不影响布局～