css元素定位
<style type="text/css">
body{
margin: 15px;
font-family: "Adobe 宋体 Std L";
font-size:12px;
}
.father{
background-color: black;
border: 1px solid #111111;
padding: 25px;
}
.son{
padding: 10px;
margin:5px;
background-color: aliceblue;
border:1px dashed;
float:left;
}
.son2{
padding: 5px;
margin: 0px;
background-color: #111111;
border:1px dashed #111111;
}
</style>
<style type="text/css">
body{
margin: 5px;
font-family: "Adobe 宋体 Std L";
font-size: 13px;
}
.block1{
padding-left:10px;<!--列距-->
margin-right:10px;
float:left;<!--浮动在左边上层-->
}
.h3{
background-color: aliceblue;;
border: 1px dashed #233333;
clear:left;<!--清除浮动-->
}
</style>
<style type="text/css">
#block{
background-color: ];
border:1px dashed #000000;
padding: 10px;
position:absolute;<!--绝对定位，脱离了父标签-->
<!--position:relative<!--相对于自身原来的距离，在父块-->
left:20px;<!--相对于页面body的距离-->
top:40px;
}
</style>
<body>
<div id = "father">
<div id = "block">absolute</div>
<div id = "block1">relative</div>
</div>
</body>
z-index调整定位时重叠块的上下而为之，当块设置了position属性时，该值便可设置各块之间的重叠高低关系，默认值为0
<style type="text/css">
#block1{
... position: absolute;
left: 20px;
top:20px;
z-index: 1;<!--高低值-->
}
#block2{
... position: absolute;
left:10px;
top:23px;
z-index: 0;<!--高低值0-->
}
</style>
