现象：子元素用了position，脱离文档流，导致父元素没有高度。

解决方案：

1.把子元素改成浮动布局，给父元素加上overflow属性

overflow:auto;

2.在对应的子元素上，添加相同宽高的兄弟元素，该元素去掉position属性，把定位元素的top值换成margin或padding值。

#box{    height: 400px;    width: 100%;    position: absolute;    top: 50px;    left: 200px;    background-color: #0066FF;}#box1{    width: 100%;    height: 400px;    padding-top: 50px;}

3.通过js获取子元素的高，动态给父元素设置高度

var father = document.getElementById('father');var son = document.getElementById('son'); father.style.height=son.offsetHeight+'px';

总结：如果是自己写的结构建议使用第一种方案，如果是别人写的页面并且页面比较复杂，可以使用第三种，第二种方案仅作为了解。