markdown表格内换行的做法

怎么在Markdown表格内换行?记住markdown支持html和css就行,表格内换行完成可参照html的格式输入代码控制。

  • 使用html的代码控制:
    案例1:

markdown代码:

|姓名|爱好|
--|--|
张三|足球、篮球
李四|羽毛球、乒乓球
  • 1
  • 2
  • 3
  • 4

显示为:

姓名 爱好
张三 足球、篮球
李四 羽毛球、乒乓球

案例2:修改上述代码,使足球和篮球显示为两行。

markdown代码:

|姓名|爱好|
--|--|
张三|足球<br>篮球
李四|羽毛球<br>乒乓球
  • 1
  • 2
  • 3
  • 4

显示为:

姓名 爱好
张三 足球
篮球
李四 羽毛球
乒乓球

日常工作编辑文档绘制表格时,不仅仅需要规整的n*m行列表格,有时候也需要对表格进行单元格合并,比如下图:
但是Markdown本身不提供单元格合并语法,但是不要忘了,Markdown是兼容HTML的,因此,我们可以通过HTML的方式实现单元格合并。
主要用到了HTML的一个标签:

  • rowspan:规定单元格可横跨的行数。横跨几行属性值就写几,如上图中横跨7行,则rowspan=”7”
  • colspan:规定单元格可纵深的列数。HTML代码如下:
<table>
<tr>
    <td rowspan="7"> 文件状态:<br/>
        [√] 草稿<br/>
        [√] 正在修改<br/>
        [√] 正式发布 </td>
    <td>文件标识:</td>
    <td> </td>
</tr>
<tr>
    <td>当前版本:</td>
    <td>2.7</td>
</tr>
<tr>
    <td>作    者:</td>
    <td></td>
</tr>
<tr>
    <td>创建日期:</td>
    <td></td>
</tr>
<tr>
    <td>最后更新:</td>
    <td></td>
</tr>
<tr>
    <td>密    级:</td>
    <td></td>
</tr>
<tr>
    <td>版权说明:</td>
    <td></td>
</tr>
</table>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34

显示效果如下图:

文件状态:
[√] 草稿
[√] 正在修改
[√] 正式发布
文件标识:
当前版本: 2.7
作 者:
创建日期:
最后更新:
密 级:
版权说明:

2.其他举例

2.1合并行

HTML代码:

<table>
    <tr>
        <td>列一</td> 
        <td>列一</td> 
   </tr>
    <tr>
        <td colspan="2">合并行</td>    
    </tr>
    <tr>
        <td colspan="2">合并行</td>    
    </tr>
</table>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
列一 列一
合并行
合并行

2.2合并列

HTML代码:

<table>
    <tr>
        <td>列一</td> 
        <td>列二</td> 
   </tr>
    <tr>
        <td rowspan="2">合并列</td>    
        <td >行二列二</td>  
    </tr>
    <tr>
        <td >行三列二</td>  
    </tr>
</table>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

显示效果:

列一 列二
合并列 行二列二
行三列二

2.3合并行列

HTML代码:

<table>
    <tr>
        <td>列一</td> 
        <td>列二</td> 
   </tr>
   <tr>
        <td colspan="2">合并行</td>    
   </tr>
   <tr>
        <td>列一</td> 
        <td>列二</td> 
   </tr>
    <tr>
        <td rowspan="2">合并列</td>    
        <td >行二列二</td>  
    </tr>
    <tr>
        <td >行三列二</td>  
    </tr>
</table>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20

显示效果:

列一 列二
合并行
列一 列二
合并列 行二列二
行三列二

虽说利用HTML语言可以实现表格合并单元格,显示效果完全没有问题,但是产生了一个附加问题,降低了Markdown文档的可读性,看着HTML一推推的,还真难看出个啥。

Markdown的目标是易读易写,尽量不要违背这一原则。有时候技术手段不支持的,就改变下策略,不一定非得按一种方式操作,代码出现过多影响markdown的观看效果。

阅读已结束,喜欢的话就点个赞吧
注册坚果云网盘
还有其他问题,可以咨询小坚果咨询小坚果
赞(0)
网站部分内容和图片来源于网络如有侵权请联系我们删除:企业网盘坚果云的干货分享 » markdown表格内换行的做法
分享到: 更多 (0)
markdown表格内换行的做法

评论 抢沙发

评论前必须登录!

 

坚果云 便捷、安全的网盘产品

免费试用下载客户端