标签:style blog http ar os sp div 问题 log
<head> <title></title> <style type="text/css"> body { margin: 0; padding: 0; } #father { width: 500px; height: 400px; background: pink; border: 1px solid; } #child { width: 100px; height: 50px; margin-top: 20px; background: blue; } </style> </head> <body> <div id="father"> <div id="child"> </div> </div> </body>
给子div添加margin-top: 20px,发现父子DIV都一起相对BODY下移了20PX,为何不是只是子DIV下移20PX ? 如果我给父DIV添加border: 1px solid,就可以实现父DIV不动,只是子DIV相对父DIV下移了20PX,难道就一定要设置父DIV的border才能实现吗?
给父亲div 设置 overflow: hidden;有个叫 bfc 的东西 叫 块级元素格式化上下文 overflow hidden 或者描边可以触发 bfc 就可以解决这个问题。
overflow 属性:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp
标签:style blog http ar os sp div 问题 log
原文地址:http://www.cnblogs.com/disneyland/p/4117153.html