父div如果没有任何东西,子div设置margin-top,父div会下落
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body{padding:0;margin:0;background:#999;} .page-content{min-height:600px;background:#fff;} </style> </head> <body> <div class="page-content"> <div style="margin-top:50px;">gfsdghdfd</div> </div> </body> </html>
解决方法:
1、修改父元素的高度,增加padding-top样式模拟(padding-top:1px;常用)
2、为父元素添加overflow:hidden;样式即可(完美)
3、为父元素或者子元素声明浮动(float:left;可用)
4、为父元素添加border(border:1px solid transparent可用)
5、为父元素或者子元素声明绝对定位