简单的CSS样板

1、jsp的代码：

<!-- 事件记录信息开始 -->
<div class="overview-block block-base-p4p">
<div class="block-p4p block-base-p4p-item block-item" style="display: block;">
<div class="header">
<h3 class="title">近期事件：</h3>
</div>
<c:forEach items="${eventlist}" var="event">
<div class="indicator-items">
<ul>
<li class="item item-1 item-clkP4pIndustry">
<span class="name">
<b>${event.eventTitle}</b>
(${event.linkMan.contactName}于
<fmt:formatDate pattern="yyyy-MM-dd HH:mm" value="${event.createdOn}"/>)
</span>
<span class="value">${event.eventContent}</span>
</li>
</ul>
</div>
</c:forEach>
</div>
</div>
<!-- 事件记录信息开始 -->

2、CSS的代码：ida-mydata.css

@CHARSET "UTF-8";
.overview-block {
border: 1px solid #DAE2ED;
background: #fff;
padding: 10px;
margin-bottom: 30px
}
.overview-block .block-p4p {
display: none
}
.overview-block .block-item {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border: 1px solid #DAE2ED;
clear: both
}
.overview-block .header {
height: 35px;
line-height: 35px;
background: #EDF1F5;
padding-left: 10px;
position: relative;
margin-top: -18px;
}
.overview-block h3 {
font-size: 18px;
color: #333;
font-weight: bolder
}
.overview-block li, .overview-block ul {
margin: 0;
padding: 0
}
.overview-block li {
list-style: none;
height: 85px;
font-size: 14px;
padding-top: 15px;
padding-left: 10px
}
.overview-block .indicator-items ul {
display: table;
width: 100%;
*display: inline-block
}


.overview-block .indicator-items ul li {
display: table-cell;
*float: left;
*display: inline-block
}


.overview-block .indicator-items .item {
border-left: 1px solid #dfe6ef
}


.overview-block .indicator-items .item .compare, .overview-block .indicator-items .item .value{
font-size: 14px;
display: block;
white-space: nowrap;
}


.overview-block .indicator-items .item-1 {
border-left: none
}


.overview-block .indicator-items .item .name {
font-size: 16px;
color: #333;
}


.overview-block .indicator-items .name {
color: #333;
font-size: 16px
}


.overview-block .indicator-items .value {
color: #333;
font-size: 20px;
margin: 10px 0 5px 0
}


.overview-block .block-item .indicator-items {
height: 100px
}


.overview-block .block-item .indicator-items li {
cursor: pointer;
position: relative;
border-bottom: 1px solid #dae2ed
}

3、效果图片：