表格中內容對齊、換行
在Markdown中我們都會這樣使用表格:
| 姓名 | 年齡 | 愛好 | | -- | -- | -- | | 小明 | 9 | 籃球 | | 小剛 | 10 | 籃球、足球 |
效果如下:
姓名 | 年齡 | 愛好 |
---|---|---|
小明 | 9 | 籃球 |
小剛 | 10 | 籃球、足球 |
設置對齊方式
|:--:|
居中對齊、|:--|
左對齊、|--:|
右對齊。
| 姓名 | 年齡 | 愛好 | | :--: | :-- | --: | | 小明 | 9 | 籃球 | | 小剛 | 10 | 籃球、足球 |
效果如下:
姓名 | 年齡 | 愛好 |
---|---|---|
小明 | 9 | 籃球 |
小剛 | 10 | 籃球、足球 |
表格內容換行
Markdown本身不提供單元格換行,但是,Markdown是兼容HTML的,因此,我們可以使用<br>來實現單元格換行。
| 姓名 | 年齡 | 愛好 | | :-- | :-- | :-- | | 小明 | 9 | 籃球 | | 小剛 | 10 | 籃球 <br> 足球 |
效果如下:
姓名 | 年齡 | 愛好 |
---|---|---|
小明 | 9 | 籃球 |
小剛 | 10 | 籃球 足球 |
表格中單元格的合並
合並單元格還是要與HTML網頁結合起來,來達到效果。
這會用到HTML的標簽:
colspan
:規定單元格可縱深的列數rowspan
:規定單元格可橫跨的行數
可以直接在markdown中寫html標簽,不過渲染出來的樣式,不同的markdown編輯器會有不同。
合並表格行
<table> <tr> <td>張</td> <td>王</td> <tr> <tr> <td colspan="2">姓氏</td> <tr> </table>
效果圖:
合並表格列
<table> <tr> <td>類別</td> <td>名稱</td> </tr> <tr> <td rowspan="2">顏色</td> <td>紅色</td> </tr> <tr> <td>黃色</td> </tr> <tr> <td rowspan="2">姓氏</td> <td>張</td> </tr> <tr> <td>王</td> </tr> </table>
效果圖:
綜合使用
<table> <tr> <td>類別</td> <td>名稱</td> </tr> <tr> <td rowspan="2">顏色</td> <td>紅色</td> </tr> <tr> <td>黃色</td> </tr> <tr> <td colspan="2">姓氏</td> </tr> <tr> <td>王</td> <td>張</td> </tr> </table>
效果圖: