HTML/CSS示例：创建并格式化带有合并单元格的财务计划表格,-CSDN博客

本文链接：https://blog.csdn.net/m0_61682542/article/details/136410550

<table border="5">
</table>

border是边框宽度

<table width="100%" height="200>
</table>

width是宽，height是高

<table cellpadding="6">
</table>

<table cellspacing="0">
</table>

<table>
<caption>科目成绩</caption>
</table>

<table>
    <tr>
        <td rowspan="3">科目</td>
    </tr>
</table>

变为

<table>
    <tr>
        <td colspan="3">科目<td>
    </tr>
</table>

变为

接下来给出一个例子：

制作这张表

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
    <!-- ********* Begin ********* -->
    <style center>
    body{
       margin:30px;
    }
    table{
       /*居中对齐*/
        text-align:center;
    }
    </style>
    <!--设置表格-->
    <table border="2" width="100%" cellspacing="0" cellpadding="6">
        <caption>本周财政计划</caption>
        <tr>
            <td colspan="2" rowspan="2">项目</td>
            <td colspan="2">本周发生</td>
            <td rowspan="2">备注</td>
        </tr>
        <tr>
            <td>收入</td>
            <td>支出</td>
        </tr>
        <tr>
            <td rowspan="3">收入</td>
            <td>贷款收回</td>
            <td>8700</td>
            <td>0</td>
            <td></td>
        </tr>
        <tr>
            <td>内部转款</td>
            <td>6000</td>
            <td>0</td>
            <td></td>
        </tr>
        <tr>
            <td>收入合计</td>
            <td>14700</td>
            <td>0</td>
            <td></td>
        </tr>
        <tr>
            <td rowspan="3">支出</td>
            <td>采购支出</td>
            <td>0</td>
            <td>5000</td>
            <td></td>
        </tr>
        <tr>
            <td>工资支出</td>
            <td>0</td>
            <td>7000</td>
            <td></td>
        </tr>
        <tr>
            <td>支出合计</td>
            <td>0</td>
            <td>12000</td>
            <td></td>
        </tr>
    </table>
        
        
    <!-- ********* End ********* -->
</body>
</html>

表格table