html-3,table 表格标签 tr th td caption thead tbody tfoot 的简单使用

 <!--
     table  border='1' style="border-collapse:collapse;"
             border  表格的像素宽度
             border-collapse:collapse 为表格设置合并边框模型
             tr  表格行 一个tr包含多个th 或td
                 th  表示居中加粗
                 td  表格描述（默认正常显示）

             caption 标题独占一行 在表格外面
             thead  tbody  tfoot   无论顺序是怎么写的 他会自动按这个顺序展示
 -->

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>表格标签与表单标签</title>
 </head>
 <body>

     <table border="2" style="border-collapse:collapse" width="150" height="50">
         <tr>
             <td>id</td>
             <td>name</td>
             <td>age</td>
             <td rowspan="2">占两行</td>
             <td>空列</td>
         </tr>
         <tr>
             <td>1</td>
             <td>wang</td>
             <td>18</td>
             <td colspan="2">占两列</td>
         </tr>
     </table>

     <!--
         caption 标题独占一行 在表格外面
         thead  tbody  tfoot   无论顺序是怎么写的 他会自动按这个顺序展示
     -->
     <table border="2">
         <caption>人物介绍</caption>

          <tfoot>
             <tr>
                 <th>三妹</th>
                 <td>15</td>
                 <td>女</td>
                 <td rowspan="3" >占三行</td>
             </tr>
         </tfoot>

         <thead>
             <tr>
                 <th>大哥</th>
                 <td>18</td>
                 <td>男</td>
             </tr>
         </thead>

         <tbody>
             <tr>
                 <th>老二</th>
                 <td>17</td>
                 <td>男</td>
             </tr>
         </tbody>
     </table>

 </body>
 </html>