CSS 中，为什么绝对定位（absolute）的父级元素必须是相对定位（relative）？

搞清楚了，正确的应该是只要父级元素=设置了position值（absolute或者relative），那么子元素的position都是以父级元素来定位的。

回答：

其实绝对定位absolute的参照对象是“离它最近的已定位的祖先元素”，这句话里有两个关键，一个是“离它最近的祖先元素”，意思是那个参照元素不一定是父元素，也可以是它的爷爷、爷爷的爷爷等等，如果它的祖先里同时有2个及以上的定位元素，就参照离它最近的一个元素定位还有一个是“已定位”，这个定位也不一定非要是相对定位，也可以是绝对定位，为什么一般都是用相对定位呢，因为相对定位的特性是虽然它定位了，就算给了偏移量它离开了原来的地方，但是它原来占的地方也不会让出来的，这样的好处是原来在它周围的其他元素不会因为它的离开而改变位置而使页面乱套，所以用相对定位是非常合适的（如果你另有其他需要，祖先元素绝对定位也不是不可以）

---

<div id="father">
    <div class="son"></div>
</div>

.father{
            width: 200px;
            height: 200px;
            background-color: red;
            margin:0 auto;
            /*position: relative;*/
        } .son{
            width: 50px;
            height: 50px;
            background-color: yellow;
            position: absolute;
            top: 10px;
            left: 10px;

Css–父元素没有relative

Css–父元素有relative