正点CSS实例--表格2

.datalist{
    border:1px solid #0058a3;   
    font-family:Arial;
    border-collapse:collapse;   
    background-color:#eaf5ff;  
    font-size:14px;
}
.datalist caption{
    padding-bottom:5px;
    font:bold 1.4em;
    text-align:left;
}
.datalist th{
    border:1px solid #0058a3;    /* 锟斤拷锟斤拷票呖锟?*/
    background-color:#4bacff;    /* 锟斤拷锟斤拷票锟斤拷锟缴?*/
    color:#FFFFFF;                /* 锟斤拷锟斤拷锟斤拷锟缴?*/
    font-weight:bold;
    padding-top:4px; padding-bottom:4px;
    padding-left:12px; padding-right:12px;
    text-align:center;
}
.datalist td{
    border:1px solid #0058a3;    /* 锟斤拷元锟斤拷呖锟?*/
    text-align:left;
    padding-top:4px; padding-bottom:4px;
    padding-left:10px; padding-right:10px;
}
.datalist tr.altrow{
    background-color:#c7e5ff;    /* 锟斤拷锟叫憋拷色 */
    border-collapse: collapse;
}

<table class="datalist" summary="list of members in EE Studay">

    <caption>Member List</caption>
    <tr>
        <th scope="col">Name</th>
        <th scope="col">Class</th>
        <th scope="col">Birthday</th>
        <th scope="col">Constellation</th>
        <th scope="col">Mobile</th>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>isaac</td>
        <td>W13</td>
        <td>Jun 24th</td>
        <td>Cancer</td>
        <td>1118159</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>girlwing</td>
        <td>W210</td>
        <td>Sep 16th</td>
        <td>Virgo</td>
        <td>1307994</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>tastestory</td>
        <td>W15</td>
        <td>Nov 29th</td>
        <td>Sagittarius</td>
        <td>1095245</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>lovehate</td>
        <td>W47</td>
        <td>Sep 5th</td>
        <td>Virgo</td>
        <td>6098017</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>slepox</td>
        <td>W19</td>
        <td>Nov 18th</td>
        <td>Scorpio</td>
        <td>0658635</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>smartlau</td>
        <td>W19</td>
        <td>Dec 30th</td>
        <td>Capricorn</td>
        <td>0006621</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>whaler</td>
        <td>W19</td>
        <td>Jan 18th</td>
        <td>Capricorn</td>
        <td>1851918</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>shenhuanyan</td>
        <td>W25</td>
        <td>Jan 31th</td>
        <td>Aquarius</td>
        <td>0621827</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>tuonene</td>
        <td>W210</td>
        <td>Nov 26th</td>
        <td>Sagittarius</td>
        <td>0091704</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>ArthurRivers</td>
        <td>W91</td>
        <td>Feb 26th</td>
        <td>Pisces</td>
        <td>0468357</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>reconzansp</td>
        <td>W09</td>
        <td>Oct 13th</td>
        <td>Libra</td>
        <td>3643041</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>linear</td>
        <td>W86</td>
        <td>Aug 18th</td>
        <td>Leo</td>
        <td>6398341</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>laopiao</td>
        <td>W41</td>
        <td>May 17th</td>
        <td>Taurus</td>
        <td>1254004</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>dovecho</td>
        <td>W19</td>
        <td>Dec 9th</td>
        <td>Sagittarius</td>
        <td>1892013</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>shanghen</td>
        <td>W42</td>
        <td>May 24th</td>
        <td>Gemini</td>
        <td>1544254</td>
    </tr>
    <tr class="altrow">        <!-- 偶数行 -->
        <td>venessawj</td>
        <td>W45</td>
        <td>Apr 1st</td>
        <td>Aries</td>
        <td>1523753</td>
    </tr>
    <tr>                    <!-- 奇数行 -->
        <td>lightyear</td>
        <td>W311</td>
        <td>Mar 23th</td>
        <td>Aries</td>
        <td>1002908</td>
    </tr>
</table>