                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

relative与absolute

还是不明白为什么父元素加relative,子元素加absolute会变成图一；而父元素加absolute，子元素加relative会变成图二？

weixin_慕虎8024491

2019-11-30

源自：初识HTML(5)+CSS(3)-升级版 13-9

关注问题我要回答

849

操作

收起

2 回答

Fidd 回答被采纳 +2 积分
2019-12-01

1.默认情况由于div元素是块级元素，另起一行，因此div子元素出现在图片下方，如第二幅图所示；

2.第一种情况是给子元素设置absolute，改变了默认的流模型，更改了子元素相对于父元素的位置，使子元素底部相距父元素为0，表现为第一幅图情况；

3.给子元素设置relative，那么子元素只是相对于自己原来的位置移动，然后设置距离自己原来的位置底部为0，相当于没有改变位置，所以和第一种默认情况没什么两样。

1 回复有任何疑惑可以回复我~

收起回答

weixin_慕虎8024491 提问者

非常感谢！

2019-12-01 回复有任何疑惑可以回复我~

慕的地8138683
2020-02-11

求问那为什么要涉及父元素，relative与absolute组合使用，直接子元素absolute不可以吗

0 回复有任何疑惑可以回复我~

收起回答

xinghuo72

同样初学，我说下我的想法，当默认flow流模型时，父元素与子元素无法重叠，只有父元素与子元素同时设置为layer层模型时才能实现嵌套，absolute是本元素相对父元素的设置，对子元素使用，relative是本元素相对本元素在flow流模型下位置的设定，对父元素使用后只改变模型类别，不设置参数不影响父元素位置。不知道对不对，希望能帮助到你。

2020-02-16 回复有任何疑惑可以回复我~

0/150

提交

取消

初识HTML(5)+CSS(3)-升级版

参与学习 1225293 人
解答问题 18230 个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

进入课程

本课相似问答

1 回答absolute与relative的使用

2 回答relative与absolute的运用

2 回答Relative与Absolute组合使用

4 回答Relative与Absolute组合使用

7 回答relative与absolute组合使用

搜索更多本课相关问答

relative与absolute

我要回答关注问题

热搜

最近搜索清空

relative与absolute

2 回答

本课相似问答

relative与absolute