定位元素有下面的两个问题,在做页面时会经常碰到,为了备忘
1.position:relative;如果一个元素的子元素或孙元素有position:relative属性的话,overflow:hidden;不能隐藏子元素,需要将这个元素设置position:relative;(IE6)
例:
<style type="text/css">
.test1{200px;overflow:hidden;}
.test2{8000px;position:relative;}
</style>
<div class="test1">
<div class="test2"></div>
</div>
2.position:absolute;定位元素的height:100%;那这个元素的高度是等于以谁为参考元素的高度
例:
<style type="text/css">
.test1{position:relative;height:200px;}
.test2{position:absolute;height:100%;top:0;left:0;}
</style><div class="test1">
<div>
<div class="test2"></div>
sssssssssssss<br/>
test<br/>
</div>
</div>
那么此时:test2的高度是200px;因为test2已经脱离了正常文档流程,是以test1为基准对齐的,所以要按test1计算,如果给test2的父元素设置position:relative;那么test2的高度就是两行文字的高度