content
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/*整个大盒子*/
#content{width:1000px;height:620px;margin:0 auto;}
/*小盒子,content内的div,给他浮动*/
#content>div{float:left;}
#content>h1{color: indianred;size: A5;font-style: inherit;}
#d1{width:609px;height:377px;margin-bottom:10px;
background: aliceblue;
margin-right:10px;}
#d2{width:381px;height:377px;margin-bottom:10px;
background: cornsilk}
#d3{width:376px;height:233px;margin-right:10px;background: mediumturquoise}
#d4,#d5,#d6{width:198px;height:233px;background: lightpink}
#d4,#d5{margin-right:10px;background: antiquewhite;}
</style>
</head>
<body>
<div id="content">
<div id="d1">1</div>
<h1 style="float: bottom">pxpxpxpx</h1>
<div id="d2">2</div>
<div id="d3">3</div>
<div id="d4">4</div>
<div id="d5">5</div>
<div id="d6">6</div>
</div>
</body>
</html>
#content和#content>div的区别
content可以理解为一个大盒子
**是整个这一块**
content>div是值每一小块,即div中的div
这样对设置的大布局下,特别改变小处的样式