老师，我为什么设置子div的左外边距，子div会动，但是设置上外边距，父DIV会跟着一起动呢？
来源：7-1 定位案例
慕侠7348613
2019-08-08 10:03:48
#a{background-color: red; width: 800px;height:500px; margin-left: 200px;margin-top: 100px}
#b{background-color: blue;width: 1200px; height: 800px;position: relative; left: 500px;top: 500px; }
写回答
1回答
-
好帮手慕小尤
2019-08-08
同学你好，因为当一个元素包含在另一个元素中时（假设没有填充或边框将边界分隔开），它们的顶和/或底边界会发生叠加。解决办法如下：
1、为父元素设置border。
2、为父元素添加overflow：hidden；样式。
3、为父元素或者子元素声明浮动。
4、为父元素或者子元素声明绝对定位。
代码如下：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #a{ background-color: red; width: 800px; height:500px; margin-left: 200px; margin-top: 100px; } #b{ background-color: blue; width: 1200px; height: 800px; position: relative; overflow: hidden; left: 500px; top: 500px; } </style> </head> <body> <div id="b"> <div id="a"></div> </div> </body> </html>祝学习愉快！
0
相似问题