html5好看表格样式,CSS实现的清爽、漂亮的表格样式分享
效果：
實現代碼：
復制代碼代碼如下:
CSS實現的清爽、漂亮的表格樣式 - jb5t1.net/* CSS Document */
body {
font: normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #4f6b72;
background: #E6EAE9;
}
a {
color: #c75f3e;
}
#mytable {
width: 700px;
padding: 0;
margin: 0;
}
caption {
padding: 0 0 5px 0;
width: 700px;
font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
text-align: right;
}
th {
font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #4f6b72;
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
border-top: 1px solid #C1DAD7;
letter-spacing: 2px;
text-transform: uppercase;
text-align: left;
padding: 6px 6px 6px 12px;
background: #CAE8EA url(images/bg_header.jpg) no-repeat;
}
th.nobg {
border-top: 0;
border-left: 0;
border-right: 1px solid #C1DAD7;
background: none;
}
td {
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
background: #fff;
font-size:11px;
padding: 6px 6px 6px 12px;
color: #4f6b72;
}
td.alt {
background: #F5FAFA;
color: #797268;
}
th.spec {
border-left: 1px solid #C1DAD7;
border-top: 0;
background: #fff url(images/bullet1.gif) no-repeat;
font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}
th.specalt {
border-left: 1px solid #C1DAD7;
border-top: 0;
background: #f5fafa url(images/bullet2.gif) no-repeat;
font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #797268;
}
/*---------for IE 5.x bug*/
html>body td{ font-size:11px;}
| M9454LL/A | M9455LL/A | M9457LL/A |
| Dual 1.8GHz PowerPC G5 | Dual 2GHz PowerPC G5 | Dual 2.5GHz PowerPC G5 |
| 900MHz per processor | 1GHz per processor | 1.25GHz per processor |
| 512K per processor | 512K per processor | 512K per processor |
獲取更多JavaScript代碼，請登錄腳本之家 http://www.jb5t1.net
原文：http://www.jb51.net/css/163862.html
總結
以上是生活随笔為你收集整理的html5好看表格样式,CSS实现的清爽、漂亮的表格样式分享的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 《领域特定语言》一1.5使用代码生成
- 下一篇： 力扣 两数相加 指针操作注意事项