亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

css+html 比較好看的表格

原創(chuàng) 2019-01-13 05:10:41 354
摘要:<head>    <title>表格</title>    <style type="text/css">        table        {        &n

<head>

    <title>表格</title>

    <style type="text/css">

        table

        {

            border-collapse: collapse;

            margin: 0 auto;

            text-align: center;

        }

        table td, table th

        {

            border: 1px solid #cad9ea;

            color: #666;

            height: 30px;

        }

        table thead th

        {

            background-color: #CCE8EB;

            width: 100px;

        }

        table tr:nth-child(odd)

        {

            background: #fff;

        }

        table tr:nth-child(even)

        {

            background: #F5FAFA;

        }

    </style>

</head>

<body>

    <table width="90%" class="table">

        <caption>

            <h2>

                車間能源消耗比例</h2>

        </caption>

        <thead>

            <tr>

                <th>

                    車間

                </th>

                <th>

                    產(chǎn)量

                </th>

                <th>

                    電量

                </th>

                <th>

                    單耗

                </th>

            </tr>

        </thead>

        <tr>

            <td>

                109

            </td>

            <td>

                13

            </td>

            <td>

                1.34

            </td>

            <td>

                213

            </td>

        </tr>

        <tr>

            <td>

                109

            </td>

            <td>

                13

            </td>

            <td>

                1.34

            </td>

            <td>

                213

            </td>

        </tr>

        <tr>

            <td>

                109

            </td>

            <td>

                13

            </td>

            <td>

                1.34

            </td>

            <td>

                213

            </td>

        </tr>

        <tr>

            <td>

                109

            </td>

            <td>

                13

            </td>

            <td>

                1.34

            </td>

            <td>

                213

            </td>

        </tr>

    </table>

</body>

</html>

演示地址 -> http://47.107.64.136/CSS/3/

批改老師:天蓬老師批改時(shí)間:2019-01-13 09:14:01
老師總結(jié):寫得非常棒, 選擇器用得也非常的優(yōu)雅, 如果再用點(diǎn)單元格合并, 做的更復(fù)雜點(diǎn)更好

發(fā)佈手記

熱門詞條