每日頭條!Markdown表格-換行、合并單元格

2023-04-30 06:27:10 來(lái)源：博客園

1.表格中對(duì)其、換行處理

1.1 一般我們都會(huì)這樣用表格如下：

|排名|姓名||--|--||第一名|隔壁老王||第二名|隔壁小王、隔壁小小王|

實(shí)現(xiàn)效果圖：

(資料圖)

排名	姓名
第一名	隔壁老王
第二名	隔壁小王、隔壁小小王

1.2 當(dāng)然這里也可以通過(guò)設(shè)置`|:--|`左對(duì)齊，`|--:|`右對(duì)齊

比如下面的左對(duì)齊：

|排名|姓名||:--|:--||第一名|隔壁老王||第二名|隔壁小王、隔壁小小王|

效果：

排名	姓名
第一名	隔壁老王
第二名	隔壁小王、隔壁小小王

1.3 實(shí)現(xiàn)表格內(nèi)容換行

Markdown本身不提供單元格合并語(yǔ)法，但是，Markdown是兼容HTML的，因此，我們可以通過(guò)HTML的方式實(shí)現(xiàn)單元格合并。

|排名|姓名||:--|:--||第一名|隔壁老王||第二名|隔壁小王 
 隔壁小小王|

效果：

排名	姓名
第一名	隔壁老王
第二名	隔壁小王隔壁小小王

1.4表格結(jié)構(gòu)標(biāo)簽

使用場(chǎng)景：因?yàn)楸砀窨赡芎荛L(zhǎng)為了更好的表示表格的語(yǔ)義，可以將表格分割成表格頭部和表格主體兩大部分：

在表格標(biāo)簽中，分別用：標(biāo)簽表格的頭部區(qū)域、標(biāo)簽表格的莊體區(qū)域。這樣可以更好的分清表格結(jié)構(gòu)。

            第1列表頭  第2列表頭         
第1行第1列單元格  第1行第2列單元格         
第2行第1列單元格  第2行第2列單元格         
第3行第1列單元格  第3行第2列單元格

效果圖：

第1列表頭	第2列表頭
第1行第1列單元格	第1行第2列單元格
第2行第1列單元格	第2行第2列單元格
第3行第1列單元格	第3行第2列單元格

2.合并表格

2.1 合并表格行

這里還是要與HTML網(wǎng)頁(yè)結(jié)合起來(lái)，來(lái)達(dá)到效果。這里用到了HTML的一個(gè)標(biāo)簽，colspan：規(guī)定單元格可縱深的列數(shù)rowspan：規(guī)定單元格可橫跨的行數(shù)

小王 小小王
隔壁老王

效果圖：

小王	小小王
隔壁老王

Month Savings
January $100
February $80

效果圖:

Month	Savings
January	$100
February	$80

      合并兩列并居中   
      第一列     第二列

合并兩列并居中
第一列	第二列

例子：

                  第一行       
                  第二行，第一列            第二行，第二列            第二行，第三列       
                第三行，第一列             第三行，第二列             第三行，第三列       
                 第四行，第一列            第四行，第二列            第四行，第三列      
                 第五行，第一列             第五行，第二列             第五行，第三列

效果：

第一行
第二行，第一列	第二行，第二列	第二行，第三列
第三行，第一列	第三行，第二列	第三行，第三列
第四行，第一列	第四行，第二列	第四行，第三列
第五行，第一列	第五行，第二列	第五行，第三列

參考鏈接：

https://blog.csdn.net/qq_42711815/article/details/89257489

https://www.jianshu.com/p/bcc39682c074

https://blog.csdn.net/weixin_42118352/article/details/125230209

標(biāo)簽：