<!-- 类比礼品盒里装方块月饼。月饼的食用部分（我们把它称之为月饼肉身）要装在小包装盒里，月饼肉身即为content。月饼肉身与直接包裹它的小包装盒（我们把它叫做月饼的衣服）之间的距离叫padding。其中月饼的衣服厚度叫border。月饼的衣服与月饼礼品盒之间的距离叫margin。-->
<!-- css中的width和height指的是content的宽度和高度 --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<style type="text/css">
body{
margin:0px;
} .test1{
width:150px;
height:150px;
border:6px solid red;
} .test2{
margin-top:40px;
padding-top:40px;
width:150px;
height:150px;
border:6px solid gray;
} .test2_son{
width:80px;
height:50px;
border:12px solid blue;
}
</style>
</head>
<body>
<div class="test1">test1</div>
<div class="test2">
<div class="test2_son">test2_son</div>
</div>
</body>
</html>
test1
test2_son