0%

浅谈 css position 为 absolute 问题

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

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

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

需求

元素 A 相对于元素 B 定位

实现

1
2
3
4
5
6
7
8
9
10
11
12
13
#father {
position: relative;
}

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

#son2 {
position: absolute;
bottom: 0;
}
1
2
3
4
<div id="father">
<div id="son1"></div>
<div id="son2"></div>
</div>

自嘲

3年了,3年了!你前端弄了3年了,这都不知道?

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

后记

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

被大佬Diss

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

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

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

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

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