为什么b元素相对于a元素来定位,要在a元素的CSS中加入position:relative; ?

如题所述

既然是 b元素 相对于 a元素 来定位 如果你不给 a元素 加上 position: relative; 的话,则 b元素相对的不是 a,而是相对整个页面在定位。

你讲的其实是:相对定位嵌套绝对定位,条件是元素有嵌套父子关系:
1. a元素为父元素,b元素为子元素
2. a元素相对定位,b元素绝对定位

比如说下面结构,a是父,b是子:
<div id="a">
<!-- 此处省略一些新闻列表内容 -->
<a id="b">[更多新闻]</a>
</div>

[更多] 这个链接本来是在所有新闻列表后面的,但按美工设计需求需要放在整个新闻板块即id="a"区域的右上角,这时你就需要把a相对定位,b绝对定位,然后绝对定位的值大概为 right: 10px; top: 5px; 即可放到理想的位置。

接下来,你可以试试不给a加相对定位,把b直接绝对定位到合适的位置上,然后:缩小你的浏览器宽口或改变屏幕分辨率后去看看结果。
温馨提示:答案为网友推荐,仅供参考
相似回答