html常用标签详解5-表格标签

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

表格标签（如果有不对的，请大家多多指正。谢谢！）

1、总的表格标签概览

<table><!--表格标签start-->

        <caption></caption><!--表格标题-->

        <thead><!--表格头-->

            <tr><!--表头行-->

                <th></th><!--表头单元格-->

            </tr>

        </thead>

        <tbody><!--表格体-->

            <tr><!--表格体行-->

                <td></td><!--表格体单元格-->

            </tr>

        </tbody>

        <tfoot><!--表格脚-->

            <tr>

                <td></td>

            </tr>

        </tfoot>

    </table><!--表格标签end-->

2、table

属性：

width="300"-----整个表格的宽度

height="200"-----整个表格的高度

border="1"-----整个表格的边框宽度

cellspacing="0"-----表格中每个单元格的间距

align="center"-----整个表格在网页中的位置

当没有css属性控制的时候，页面上展现的表格是：整个表格为边框色，cellspacing为每个单元格之间的距离，td的背景色为白色

table{

border:1px solid #ccc;

border-collapse:collapse;合并相邻边框

}

<style>

table{

border: 1px solid red;

/* 合并单元格边框 */

border-collapse: collapse;

}

</style>


<table border="5" width="300" height="500" cellspacing="0" align="center"><!--表格标签start-->

        <caption>表格标题</caption><!--表格标题-->

        <thead><!--表格头-->

            <tr><!--表头行-->

                <th>谁</th><!--表头单元格-->

                <th>地点</th>

                <th>干什么</th>

            </tr>

        </thead>

        <tbody><!--表格体-->

            <tr><!--表格体行-->

                <td>夏红</td><!--表格体单元格-->

                <td>厕所</td>

                <td>吃饭</td>

            </tr>

            <tr><!--表格体行-->

                <td>王妃</td><!--表格体单元格-->

                <td>蛋糕房</td>

                <td>放屁</td>

            </tr>

        </tbody>

        <tfoot><!--表格脚-->

            <tr>

                <td>仅仅娱乐</td>

            </tr>

        </tfoot>

    </table><!--表格标签end-->