表格

table：定义一个表格，表格元素最外层的元素

th：定义表格的表头（第一行，会自动加粗）

tr：定义表格的行

td：定义表格的单元格

caption：定义表格的标题

thead：定义表格的页眉

tbody：定义表格的主体内容

tfoot：定义表格的页脚

colspan：规定单元格可以横跨的列数（横向合并）
rowspan：规定单元格可横跨的行数（纵向合并）
border-collapse：边框塌陷（决绝重复边框问题）

一般情况下表格里 thead、tbody、tfoot 可以省略不写，效果一样在。

例：

<head>
    <style>
        table,
        td,
        th {
            border: 1px solid;
            font-size: 20px;
            border-collapse: collapse;
            text-align: center;
        }
        .box1 {
            text-align: right;
        }
        td,
        th {
            width: 50px;
            height: 50px;
        }
    </style>
</head>
<body>
    <table>
        <caption>计算器</caption>
        <tr>
            <td colspan="4" class="box1">1234</td>
        </tr>
        <tr>
            <td>AC</td>
            <td>+/-</td>
            <td>%</td>
            <td>/</td>
        </tr>
        <tr>
            <td>7</td>
            <td>8</td>
            <td>9</td>
            <td>*</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
            <td>-</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>+</td>
        </tr>
        <tr>
            <td colspan="2">0</td>
            <td>.</td>
            <td>=</td>
        </tr>
    </table>
</body>

效果如图：

计算器.png