61,112
社区成员
发帖
与我相关
我的任务
分享position:absolute默认情况下是相对于谁
以下body的高度是获取#f的高度是2000px，而overlay是absolute默认获取的高度应该是相对谁呢，
一般是相对设置了relative或者absolute的最近祖先元素，但这里没有元素做过特别设置，按网上的说法那应该是相对body，
那为什么又不继承body的高度呢？
一般是相对设置了relative或者absolute的最近祖先元素，但这里没有元素做过特别设置，按网上的说法那应该是相对body，
那为什么又不继承body的高度呢？
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
#f{
height: 2000px;
}
.overlay{
position: absolute;
left: 0;
top:0;
background-color: #000000;
opacity: 0.6;
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div class="overlay"></div>
<div id="f"></div>
</body>
</html>
...全文
请发表友善的回复…
发表回复
张运领 2013-12-16
- 打赏
- 举报
并不是所有的属性都会被后代继承的哦，比如height和width就不会被继承。
如果需要做继承，在css中添加，height:inherit;试试，不过，我估计这个会继承它的父元素的height，如果body不是这个定位元素的父元素的话，是不会继承body的高度的。
而且，这里说的“position:absolute默认情况下是相对于谁”，只针对top，left，right，bottom这几个位置属性的，跟height这些无关的。
mumubangditu 2013-12-15
- 打赏
- 举报
相对于body
body设置{position:relative}
