前端HTML进阶和CSS基础——3分钟掌握表格元素及表格元素的美化

表格元素

当今的开发中表格元素应用得并不多，属于比较老的一个元素，但在CSS出现之前，整个网页的布局通常都是用表格元素来实现的。之所以现在应用不多，是因为表格元素的渲染速度过慢，不适合当前的网页布局。但表格元素也不是完全被淘汰，在一些网页的后台页面（管理员页面）还是用表格元素布局得比较多（方便）。下面用实例来快速了解表格元素。

表格元素的语义化书写

表格元素（table）的主体如图所示，标题在顶部位置，默认居中；tr表示行，有几个tr就有几行；th和td一样，只是书写规范不一样，td表示有几列，tr里面有几个td就表示这一行有几列。

表格元素语义化的书写，也可不用语义化书写，显示效果一样，但是开发者应该养成良好的语义化书写习惯，这样也更有利于代码的可维护性。

    <table>
    	<caption></caption>
        <thead>
            <tr>
                <th></th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td></td>
            </tr>
        </tfoot>
    </table