一个很好的CSS Table Style
.tab{width: 100%;
margin:0;
padding:0;
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
color: #1c5d79;
border-top:1px #c2c2c2;
border-bottom:1px #c2c2c2;
border-left:1px #c2c2c2;
border-right:1px #c2c2c2;
border-collapse: collapse;
}
.tab caption {
margin:0;
padding:0;
background: #f3f3f3;
height: 40px;
line-height: 40px;
text-indent: 28px;
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
font-size: 14px;
font-weight: bold;
color: #555d6d;
text-align: left;
letter-spacing: 3px;
border-top: dashed 1px #c2c2c2;
border-bottom: dashed 1px #c2c2c2;
}
/* HEAD */
.tab thead {
background-color: #FFFFFF;
border: none;
}
.tab thead tr th {
background-image:url("/lottery/img/table/bg.gif");
height: 22px;
line-height: 22px;
text-align: center;
color: #1c5d79;
background-repeat : repeat-x;
border-left:solid 1px #326E87;
border-right:solid 1px #326E87;
border-bottom:solid 1px #326E87;
border-collapse: collapse;
font-size: 12px;
}
/* BODY */
.tab tbody tr {
background: #f3f3f3;
font-size: 13px;
height: 12px;
line-height: 12px;
text-align: center;
event:expression(
onmouseover = function(){this.style.backgroundColor = '#E9F5FF';},
onmouseout = function(){this.style.backgroundColor = '#f3f3f3';}
)
}
.tab tbody tr.odd {
background: #F0FFFF;
}
.tab tbody tr:hover, .tab tbody tr.odd:hover {
background: #ffffff;
}
.tab tbody tr th,.tab tbody tr td {
padding: 6px;
border: solid 1px #326e87;
}
.tab tbody tr th {
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
font-size: 12px;
padding: 6px;
text-align: center;
font-weight: bold;
color: #FFFFFF;
border-bottom: solid 1px white;
}
.tab tbody tr th:hover {
background: #ffffff;
}
/* LINKS */
.tab a{
color: gray;
text-decoration: none;
font-size: 13px;
border-bottom: solid 1px white;
}
.tab a:hover {
color: blue;
border-bottom: none;
}
/* FOOTER */
.tab tfoot {
background: #f3f3f3;
height: 24px;
line-height: 24px;
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
font-size: 12px;
/*font-weight: bold;*/
color: #555d6d;
text-align: center;
letter-spacing: 3px;
border-top: solid 2px #326e87;
border-bottom: dashed 1px #c2c2c2;
}
.tab tfoot tr th,.tab tfoot tr td {
/*padding: .1em .6em;*/
}
.tab tfoot tr th {
border-top: solid 1px #326e87;
}
.tab tfoot tr td {
/**text-align: right;**/
}
页:
[1]