CSS position: absolute 属性问题详解

碰到了个问题，就是子元素设置了 position: absolute; 但是没有相对于上一级的父元素进行定位

我当时 我直接疑惑.jpg 这个表情

后来查了一下，原来是上一级的父元素要设置 position: relative; 属性

需求

元素 A 相对于元素 B 定位

实现

#father {
  position: relative;
}

#son1 {
  position: absolute;
  top: 0;
}

#son2 {
  position: absolute;
  bottom: 0;
}

<div id="father">
  <div id="son1"></div>
  <div id="son2"></div>
</div>

自嘲

3 年了，3 年了！你前端弄了 3 年了，这都不知道？

css 最基础的相对定位都不会，这前端怕是白学了

后记

等会，为啥父元素要加 position: relative; 才能生效？

被大佬 Diss

你谈的是 css 样式表，是针对 HTML 元素生效的，不是针对什么组件生效的

原来文章中用的是“组件”

文章中的“组件”修改为“元素”

感谢这位大佬。云香水识，然后这位大佬在招人，**Flow+**了解一下？

PS: 进这个大佬厂子一年，有大佬带，进去一年顶普通厂子三年，想去的可以给我留言。