新学会的一点css3的特效。（表格实战）

最新推荐文章于 2021-06-03 05:05:35 发布

dengjiao1152

最新推荐文章于 2021-06-03 05:05:35 发布

阅读量129

点赞数

原文链接：http://www.cnblogs.com/hughman/p/6557096.html

版权

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        table{
            width: 100%;
            font-size: 12px;
            margin: 0 auto;
            border: 1px solid #cad9ea;
            color:#666;
            table-layout: fixed;//改善表格呈现性能
            empty-cells: show;//隐藏不必要的干扰因素
            border-collapse: collapse;//让表格看起来更精致
        }
        th{
            border: 1px solid #cad9ea;
            padding: 0 1em 0;//其实这里加了一个背景图片

        }
        td {
            height: 20px;
            border: 1px solid #cad9ea;
            padding: 0 1em 0;
        }
        tr:nth-child(even) {//实现隔行分色。
            background-color: #f5fafe;
        }
    </style>
</head>
<body>
        <table>
            <tr>
                <th>num</th>
                <th>num</th>
                <th>num</th>
                <th>num</th>
                <th>num</th>
            </tr>
            <tr>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
            </tr>
            <tr>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
            </tr>
            <tr>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
            </tr>
            <tr>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
            </tr>
            <tr>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
                <td>123</td>
            </tr>
        </table>
</body>
</html>

转载于:https://www.cnblogs.com/hughman/p/6557096.html

dengjiao1152

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
新学会的一点css3的特效。（表格实战）

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> table{ width: 100%; font-size:...
复制链接

扫一扫