设置表格边框颜色

1、源码如下:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>设置表格边框颜色</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="JS/jquery-2.0.2.js"></script>
    <style type="text/css">
        body{
          width: 1250px;
          height: 550px;
          font-size: 12px;
          color: #FF00FF;
        }
        .tab{
          width:100%;
          height:100%;
          text-align: center;
        }
        .tab_th{
          background-color: #CCCCCC;
        }
        .tr_odd{
          background-color: #EBF2FE;
        }
        .tr_even{
          background-color: #B4CDE6;
        }
    </style>
    <script type="text/javascript">
        $(function(){
           $("tr:odd").addClass("tr_odd");
           $("tr:even").addClass("tr_even");
        });
    </script>

  </head>
  
  <body>
    <table class="tab" border="1" cellpadding="0" cellspacing="0" 
           style="border-color: #00FF00;">
        <tr class="tab_th" style="background-color: #000000;color: #FFFFFF;">
          <th>学号</th>
          <th>姓名</th>
          <th>年龄</th>
          <th>性别</th>
          <th>电话</th>
          <th>地址</th>
        </tr>
        <tr>
          <td>2013010101</td>
          <td>张三丰</td>
          <td>24</td>
          <td>男</td>
          <td>14578545452</td>
          <td>湖南省</td>
        </tr>
        <tr>
          <td>2013010102</td>
          <td>李思思</td>
          <td>21</td>
          <td>女</td>
          <td>13578545453</td>
          <td>湖北省</td>
        </tr>
        <tr>
          <td>2013010103</td>
          <td>找钱进</td>
          <td>20</td>
          <td>男</td>
          <td>15678545452</td>
          <td>广东省</td>
        </tr>
        <tr>
          <td>2013010104</td>
          <td>李四花</td>
          <td>22</td>
          <td>女</td>
          <td>14512454520</td>
          <td>广西省</td>
        </tr>
        <tr>
          <td>2013010105</td>
          <td>魏忠贤</td>
          <td>23</td>
          <td>男</td>
          <td>14845451512</td>
          <td>山西省</td>
        </tr>
        <tr>
          <td>2013010106</td>
          <td>西门和</td>
          <td>22</td>
          <td>女</td>
          <td>14854875020</td>
          <td>山东省</td>
        </tr>
        <tr>
          <td>2013010107</td>
          <td>钱多多</td>
          <td>24</td>
          <td>男</td>
          <td>15865456562</td>
          <td>浙江省</td>
        </tr>
        <tr>
          <td>2013010108</td>
          <td>刘三级</td>
          <td>22</td>
          <td>男</td>
          <td>17844545454</td>
          <td>陕西省</td>
        </tr>
        <tr>
          <td>2013010109</td>
          <td>郑少秋</td>
          <td>23</td>
          <td>女</td>
          <td>17845784572</td>
          <td>河北省</td>
        </tr>
        <tr>
          <td>2013010110</td>
          <td>王晓华</td>
          <td>22</td>
          <td>女</td>
          <td>17845454552</td>
          <td>河南省</td>
        </tr>
    </table>
  </body>
</html>

2、显示结果如下:


 

posted @ 2018-07-05 16:18  Fairyspace  阅读(636)  评论(0编辑  收藏  举报