布局基础--版块
制作背景
渐变叠加、白色描边(内部,切片)
外边框1PX描边(外部,不切片)
结构
<div class="part_1">
<div class="part_1_top">
<div class="part_1_top_name">标题内容</div>
<div class="part_1_top_more">更多</div>
<div class="clear"></div>
</div>
<div class="part_1_ctn">此处显示内容</div>
</div>
样式
.part_1 {
border: 1px solid #dcdcdc;
}
.part_1_top {
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #dcdcdc;
line-height: 29px;
background-image: url(images/test1_03.gif);
background-repeat: repeat-x;
height: 29px;
}
.part_1_top_name {
background-image: url(images/11.png);
background-repeat: no-repeat;
float: left;
height: 29px;
padding-left: 35px;
background-position: 10px center;
color: #006600;
font-family: "黑体";
font-size: 14px;
}
.part_1_top_more {
float: right;
height: 29px;
color: #999999;
padding-right: 10px;
}
.part_1_ctn {
padding: 30px;
}
要点
外容器part_1设置四边框
头部容器part_1_top设置下边框