为什么js的marginTop参考对象不是父元素
0
悬赏园豆：30
[待解决问题]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>测试</title> <style type="text/css"> #parent { width:200px; height:200px; background-color:red; } #children { width:60px; height:60px; background-color:green; margin:0px auto; } </style> </head> <body> <div id="parent"> <div id="children"></div> </div> <script type="text/javascript"> document.getElementById("children").style.marginTop="60px"; </script> </body> </html>
为什么children的margintop参考对象不是父元素，而是窗口
所有回答(4)
0
我简单测试了一下，发现margintop的参考对象依然是父元素。
如果children不是parent里面的第一元素，那么效果是预期的。例如：
<div id="parent"> <h1>Hello World</h1> <div id="children"></div> </div>
原因求CSS达人解答。
0
本例中，如果children是parent的唯一元素，而且parent也是body的唯一元素，那么参照父元素其实等于参照body，不是吗
您老能否再说的清楚一点，可能我对CSS的理解有所偏差。
子元素的margint-top属性的参考对象不是它的父元素吗
@一落叶而知秋: 不好意思，这个回答有误，我会再研究一下这个问题
0
这个是外边距合并问题
0
css中margin-top,margin-bottom有两种情况
1，如：
<div style="margin-bottom:20px;"></div><div style="margin-top:10px;"></div>
当div1的bottom与div2的top的margin都有定义样式时，取其中较大的一个，这里就只会间距为20px，而不会是30px.
2，如：
<div class="parent" style="margin-top:10px;"><div class="son" style="margin-top:20px;"></div></div>
此时parent的margin-top会显示为20px;
当两个父子div有相邻的外边距时，以其中一个较大的为实，所以这里显示的是parent上边距为20px,而parent 与son之间没有外边距。
这里还要注意，只有上下外边距有这个规则，左右是没有的。
