«

表格标题,行的颜色

MitSeek 发布于 阅读：31 HTML 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            table{
                background: #000eee;
                color: white;
            }
            caption{
                background: #00ff00;
                border-radius:30px 30px 0 0;
                font-size: 30px;
                color: #fff;
                border: 1px solid #0d0d0f;
            }
            th,td{
                padding: 10px 50px 20px;
            }
            tr:nth-child(2n){/* 偶数行的背景颜色 */
                background: #1deeee;
            }
            tr:nth-child(2n+1){/* 计数行的背景颜色 */
                background: #ff83fa;
            }
        </style>
    </head>
    <body>

            <table border="1" cleepadding="100" cellspacing="0">
                <caption>员工表</caption>
                <tr>
                    <th>姓名</th>
                    <th>职位</th>
                    <th>薪资</th>
                </tr>
                <tr>
                    <td>小明</td>
                    <td>经理</td>
                    <td>5000</td>                   
                </tr>
                <tr>
                    <td>小红</td>
                    <td>秘书</td>
                    <td>10000</td>                  
                </tr>
            </table>

    </body>
</html>

HTML