标签：
最近搞个wap ，有一个需求就是一些文字描述定位到一张图片上的某个地方，按照以往的方式直接通过定位div
position: absolute;
PC chrome 模拟手机显示没问题！
但是，在ipad和安卓平板做测试，发现文字描述并没有定位打图片中，发现消失呢！
研究了好久，发现是代码的位置问题。
修改前：
<figure> <a href="default.htm"><img src="css/images/banner1.jpg"></a> <figcaptiontop> <hgroup> <h3 class="clearfix"> <a href="javascript:void(0)" id="JiangLi"><strong></strong></a></h3> </figcaptiontop> <figcaptionbottom> <h3 class="clearfix"> <span>（108作品）</span> </h3> </figcaptionbottom> </figure>
这样父元素就会把子元素遮盖了
如果把figcaptiontop提到外层和父元素同级，则就不会被遮盖了
修改后：
<figure> <a href="default.htm"><img src="css/images/banner1.jpg"></a> </figure> <figcaptiontop> <hgroup> <h3 class="clearfix"> <a href="javascript:void(0)" id="JiangLi"><strong></strong></a></h3> </figcaptiontop> <figcaptionbottom> <h3 class="clearfix"> <span>（108作品）</span> </h3> </figcaptionbottom>
这样无论是安卓浏览器还是IE都显示在最顶层！
标签：
原文地址：http://www.cnblogs.com/CrazyAnts/p/4920065.html
