细线表格的css实现

Solution, WEB & CSS & XHTML, cooode Add comments |

总用css做不好细线表格。搞来搞去的回到表格属性中去。看到google的细线表格,搜了css一把。嗯。还不错。代码如下:

/* —— tables —— */

table {
border-collapse: collapse;
line-height: 125%;
}

th, td {
text-align: left;
vertical-align: top;
}

table {
margin: 1em 0 0 1px;
border: 1px solid;
border-color: #3366CC;
border-spacing: 0;
border-collapse: collapse;
clear: right;
}

th {
font-weight: bold;
text-align: left;
padding: 6px 12px;
border: 1px solid #3366CC;
background-color: #e5ecf9;
}

td {
padding: 6px 12px;
border: 1px solid #3366CC;
background-color: white;
text-align: left;
vertical-align: top;
}

td h1, td h2, td h3, td h4, td h5 {
margin-left: 0;
}

td ul, td ol {
margin: 0 0 1em 15px;
padding: 0;
}

td p, td dl {
margin: 0 0 1em 0;
padding: 0;
}

td *+p {
margin: 1em 0 0 0;
padding: 0;
}

tr.alt td, td.alt {
background: #f5f5f5;
}

Leave a Reply

You must be logged in to post a comment.


Powered byWordPress 2.6.2 | Theme by N.Design Studio | Processed in 0.26 秒 苏ICP备07500719号

Entries RSS Comments RSS 登录
Links to Page