css 子级加了绝对定位 父级撑不开 当子级div使用绝对定位，父级div高度自适应问题
CSS \u7236\u7ea7div\u7edd\u5bf9\u5b9a\u4f4d\u5f71\u54cd\u5b50\u7ea7div\u7684\u95ee\u9898div\u5b9a\u4f4d\u95ee\u9898\uff0cabsolute,\u7edd\u5bf9\u5b9a\u4f4d\uff0c\u662f\u5bf9\u6574\u4e2a\u9875\u9762\u6765\u8bf4\u7684\uff0c\u4e00\u822c\u7236\u7ea7\u7684div\u7528\u76f8\u5bf9\u5b9a\u4f4d\uff0c\u5b50\u7ea7\u7684div\u7528\u7edd\u5bf9\u5b9a\u4f4d\u5c31\u80af\u5b9a\u4e0d\u4f1a\u9519\u7684\uff0c\u4f60\u53ef\u4ee5\u8bd5\u4e00\u8bd5\uff01
\u53c8\u8981\u7236div\u81ea\u9002\u5e94\uff0c\u53c8\u8981\u5b50div\u7edd\u5bf9\u5b9a\u4f4d\uff0c\u662f\u6ca1\u529e\u6cd5\u505a\u5230\u7684\uff08\u81f3\u4e8e\u6211\u4e86\u89e3\u7684\u6682\u65f6\u505a\u4e0d\u5230\uff09
\u56e0\u4e3a\u81ea\u9002\u5e94\u5bbd\u9ad8\u662f\u9700\u8981\u4ee5\u6587\u6863\u6d41\u5e03\u5c40\u4e3a\u57fa\u7840\u7684\uff0c\u800c\u7edd\u5bf9\u5b9a\u4f4d\u5df2\u7ecf\u8131\u79bb\u4e86\u6587\u6863\u6d41\u5e03\u5c40\u4e86\u3002
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<style type="text/css">
.div01{ width:600px; background:red; }
.div02{ width:500px; border:1px solid white; position:relative; left:50px;}
.div03{ width:200px; height:150px; background:blue; position:absolute; left:0px; top:5px; color:white; text-align:center; line-height:150px;}
.div04{ width:200px; height:150px; background:green; position:absolute; right:0px; top:5px; color:white; text-align:center; line-height:150px;}
/* 添加一个占位的 ，这个占位的让程序给他赋值高度，高度要和最大绝对定位的高度相等，，不然还是会被截掉，如果绝对定位想有上下边距，高度要加上边距 */
.occup{
width: 200px;
height: 160px;
opacity:0;
filter: Alpha(Opacity=0);
z-index:0;
}
</style>
</head>
<body>
<div class="div01">
<div class="div02">
<div class="occup"></div>
<div class="div03">1</div>
<div class="div04">2</div>
</div>
</div>
</body></html>
.div01{ float:left;width:600px; background:red;}// 加个float:
扩展阅读：子绝父相怎么使用 ... 中国地图不全被罚 ... css根据子级找父级元素 ... css选择第二个子元素 ... 子代选择器和后代选择器 ... css 清除上定位 ... css子选择器的写法 ... css中has的使用 ... 什么情况下用 子绝父相 ...
