csdn：新建表格+合并单元格

旧城等待， 2023-10-05 08:22 3阅读 0赞

在csdn 使用 markdown 创作时有时会用到表格，可以使用如下两种方法

##### 一、常用方法 #####

项目     |  price   |  amount
    -------- | -----| -----
    电脑  | $1600 | 10
    手机  | $12 | 20
    导管  | $1 | 30

<table> 
 <thead> 
  <tr> 
   <th>项目</th> 
   <th>price</th> 
   <th>amount</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>电脑</td> 
   <td>$1600</td> 
   <td>10</td> 
  </tr> 
  <tr> 
   <td>手机</td> 
   <td>$12</td> 
   <td>20</td> 
  </tr> 
  <tr> 
   <td>导管</td> 
   <td>$1</td> 
   <td>30</td> 
  </tr> 
 </tbody> 
</table>

想设置文字位置使用时如下方法

| Column 1 | Column 2      |Column 2      |
    |:--------| :-------------:| -------------:|
    | centered 文本居左 | right-aligned 文本居中 |right-aligned 文本居右 |

<table> 
 <thead> 
  <tr> 
   <th align="left">Column 1</th> 
   <th align="center">Column 2</th> 
   <th align="right">Column 2</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td align="left">centered 文本居左</td> 
   <td align="center">right-aligned 文本居中</td> 
   <td align="right">right-aligned 文本居右</td> 
  </tr> 
 </tbody> 
</table>

上面的方法写一些规则的表格很方便，如果表格中存在合并单元格，上面方法不支持，可以使用如下方法实现

##### 二、HTML #####

示例如下，行列都有合并单元格

<table>
      <tr>
      <td colspan="10">连接标志 Connect Flags</td>
      </tr>
      <tr>
      <td rowspan="7">byte 8</td>
      <td >User Name Flag (1) 用户名标志</td>
      <td rowspan="7">1</td>
      <td rowspan="7">1</td>
      <td rowspan="7">0</td>
      <td rowspan="7">0</td>
      <td rowspan="7">1</td>
      <td rowspan="7">1</td>
      <td rowspan="7">1</td>
      <td rowspan="7">0</td>
      </tr>
      <tr> 
      <td >Password Flag (1) 密码标志</td>
     </tr>
      <tr> 
      <td >Will Retain (0) Will 保留标志</td>
     </tr>
        <tr> 
      <td >Will QoS (01) Will 服务质量</td>
     </tr>   
    </table>

<table> 
 <tbody> 
  <tr> 
   <td colspan="10">连接标志 Connect Flags</td> 
  </tr> 
  <tr> 
   <td>byte 8</td> 
   <td>User Name Flag (1) 用户名标志</td> 
   <td>1</td> 
   <td>1</td> 
   <td>0</td> 
   <td>0</td> 
   <td>1</td> 
   <td>1</td> 
   <td>1</td> 
   <td>0</td> 
  </tr> 
  <tr> 
   <td>Password Flag (1) 密码标志</td> 
  </tr> 
  <tr> 
   <td>Will Retain (0) Will 保留标志</td> 
  </tr> 
  <tr> 
   <td>Will QoS (01) Will 服务质量</td> 
  </tr> 
 </tbody> 
</table>

写法如下

tr 代表行，td 代表一个小单元格

①、合并行 
    
    <td rowspan="7">1</td>
    
    ②、合并列 
    
    <td colspan="10">2</td>