Web表格

HTML元素学习

1：表格：表格的作用是显示表格数据，小范围内布局

表格的框架

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>TableDemo</title>
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
 </head>

 <body>
    <table border = "10px" width = "400px">
        <caption>Calories&Fat</caption>
        <tr height = "40px"> 
        <!--表头，表头为Menuitem calories Fat(g)-->
            <th>Menu item</th>
            <th>Calories</th>
            <th>Fat(g)</th>
        </tr>
        <tbody align = "center"><!--居中-->
        <tr >
            <td>Chieck noold soup</td>
            <td>120</td>
            <td>2</td>
        </tr>

        <tr >
            <td>Caesar salard</td>
            <td>400</td>
            <td>26</td>
        </tr>
        </tbody>
    </table>
    
 </body>
</html>

要点：

一次定义，处处使用：<tbody></tbody>,用来设置表格的属性；

 border = "10px" width = "400px" 设置表格属性

 <caption>Calories&Fat</caption>设置表头

单元格合并：

左右合并用 colspan = "2";后面接单元格的个数（包含自己），并删除后面合并的个数

上下合并 rowspan= "2";后面接单元格的个数（包含自己），并删除后面的个数；