我们知道，当子元素float的时候，虽然没有脱离文本流，但是也会使父元素坍缩，也就是父元素的高度或者宽度变为0，解决办法就是让父元素的overflow为hidden。
今天我遇到一个bug，如下代码所示：
<div class="wrap"> <div class="main"> <img src="../JS+CSS3实现带预览图幻灯片效果/images/1.jpg" height="500" width="1280" alt=""> </div> </div>
.wrap{ position: relative; } .main{ position: absolute; } img{ position: absolute; width: 100%; top: 0; left: 0; }
设置了img为absolute后，绝对定位如果父级不使用position:relative，而直接使用position:absolute绝对定位，这个时候将会以body标签为父级，使用position:absolute定义对象无论位于DIV多少层结构，都将会被拖出以<body>为父级（参考级）进行绝对定位。，但它是脱离文本流的，也就是无论如何，它都撑不开父容器了，而当父容器也是absolute的时候呢，这时，连它自己都显示不出来了，之前一直没有遇到过这个问题，后来查阅资料，加上自己探索，发现只能手动设置父元素的宽高，所以在这里，与其说是分享，倒不如说是自己的一个小笔记吧~！好记性不如烂笔头嘛。