你的心如利箭 在风中笔直的飞翔
github DNS ALEXA CDN
jquery JS CSS CSS3 HTML5 svg php --- isux w3cplus

21270

  博客园  :: 首页  ::  ::  ::  :: 管理

 

<style type="text/css">
/*蓝表格*/
.table1{border:1px solid #4472c4;border-collapse:collapse;width:100%;margin-top:10px;margin-left:auto;margin-right:auto;}
.table1 tr{border:1px solid #4472c4;}
.table1 th{padding:5px;font-size:14px;background:#4472c4;color:#FFF;text-align:center;}
.table1 td{padding:5px 10px;font-size:14px;}

/*灰表格*/
.table2{border:1px solid #c4c4c4;border-collapse:collapse;width:100%;margin-top:10px;margin-left:auto;margin-right:auto;}
.table2 tr{border:1px solid #c4c4c4;}
.table2 th{padding:5px;font-size:14px;background:#c4c4c4;color:#333;text-align:center;}
.table2 td{padding:5px 10px;font-size:14px;}

/*无边框表格*/
.table0{border:0;border-collapse:collapse;width:100%;margin-top:10px;margin-left:auto;margin-right:auto;}
.table0 th{padding:5px;font-size:14px;text-align:center;}
.table0 td{padding:5px 10px;font-size:14px;}
</style>

<table class="table1">
<tr><th>ID</th><th>名称</th><th>时间</th><th>操作</th></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
</table>
<table class="table2">
<tr><th>ID</th><th>名称</th><th>时间</th><th>操作</th></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
</table>
<table class="table0">
<tr><th>ID</th><th>名称</th><th>时间</th><th>操作</th></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
</table>

 

 

 

一个有边框的蓝表格:

<style type="text/css">
/*蓝表格*/
.table1{border-collapse:collapse;width:50%;margin-top:10px;text-align:center;}
.table1 th{border:1px solid #4472c4;padding:5px;font-size:14px;background:#4472c4;color:#FFF;}
.table1 td{border:1px solid #4472c4;}
</style>
<table class="table1">
<tr><th>ID</th><th>名称</th><th>时间</th><th>操作</th></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
<tr><td>10005</td><td>啊啊啊啊</td><td>2014-9-18</td><td>启用</td></tr>
</table>

 

 

...

posted on 2014-09-26 11:43  bjhhh  阅读(181)  评论(0编辑  收藏  举报