Markdown使用table标签创建表格的问题
来源:互联网 发布:java中的final关键字 编辑:程序博客网 时间:2024/05/23 18:30
使用Markdown写东西有时需要插入表格,方式有两种:
- 1.使用Markdown的表格语法
- 2.使用html的
<table>
标签来创建表格
但是某些Markdown编辑器中使用<table>
标签会出现表格前有空行的情况。
问题复现
先看使用Markdown语法创建表格:
| Tables | Are | Cool ||----------|:-------------:|------:|| col 1 is | left-aligned | $1600 || col 2 is | centered | $12 || col 3 is | right-aligned | $1 |
效果如下(分割线中间的表格)
同样的表格使用<table>
标签创建:
<table> <tr> <th>Tables</th> <th>Are</th> <th>Cool</th> </tr> <tr> <td>col 1 is</td> <td>left-aligned</td> <td>$1600</td> </tr> <tr> <td>col 2 is</td> <td>centered</td> <td>$12</td> </tr> <tr> <td>col 3 is</td> <td>right-aligned</td> <td>$1</td> </tr></table>
效果如下:(分割线中间的表格)
会发现表格前多了很多</br>
换行(注意效果里的</br>
代码是我加的,因为CSDN的Markdwon不会有这种情况出现)。
解决方法
解决办法是将代码改为紧凑模式,修改代码如下:
<table><tr><th>Tables</th><th>Are</th><th>Cool</th></tr><tr><td>col 1 is</td><td>left-aligned</td><td>$1600</td></tr><tr><td>col 2 is</td><td>centered</td><td>$12</td></tr><tr><td>col 3 is</td><td>right-aligned</td><td>$1</td></tr></table>
效果如下:(分割线中间的表格)
说明
- 1由于使用Haroopad编辑器写东西再用Hexo发布到Github上,所以会有这种情况出现。如果是其他编辑器,比如简书,这个不会有,因为简书压根儿不支持
<table>
标签的表格,CSDN上是支持的,不会出现以上问题。 - 2.使用哪种方式创建表格根据自己的需要而定,Markdown语法简单,但是缺点是不支持列宽度定义,表格样式定义,单元格合并等。
<table>
标签相比较而言灵活很多。 - 3.很多时候直接写表格代码是很累的,比较好的方案是在Excel中编辑,再生成代码,网上搜索相应工具也有很多,比如Tables Generator。
- 4.笔者使用Excel自行写了个生成
<table>
代码的工具生成压缩的表格代码,在EXCEL中编辑好表格,生成的表格代码列宽会根据Excel中的表格列宽转成百分比,编辑后点击生成表格代码
即在Excel文件的同一目录中出现Output.txt
文件,将代码复制到Markdown中即可。
代码生成工具请移步这里最后下载
阅读全文
0 0
- Markdown使用table标签创建表格的问题
- HTML表格标签的使用-<table>
- 充分使用表格标签(Table)
- 充分使用表格标签(Table)
- 使用table标签制作常用的html表格
- Silverlight中使用Grid创建自定义的Table表格
- Markdown之表格table的处理
- table表格类标签的应用
- table标签,认识网页上的表格
- table标签,认识网页上的表格
- table标签,认识网页上的表格
- table标签,认识网页上的表格
- table标签,认识网页上的表格
- HTML+CSS基础 table,td标签创建一个单行的表格
- 表格标签的使用
- 使用Element-ui的Table时表格不能显示问题
- 标签—table(表格)
- <table>表格标签
- 【一起来学C语言】函数(二)
- LeetCode-021 Merge Two Sorted Lists
- angularJs中修改controller后的数据没有重新渲染页面
- mysql 查看帮助文档,以及怎样创建表
- python 操作 postgreSQL 数据库 Demo ( 基于PyGreSQL 包)
- Markdown使用table标签创建表格的问题
- 斐讯0元购路由器可靠吗?想必这是很多人都会问的问题
- wechat4J存在的BUG
- javascript中常用鼠标事件和键盘事件
- 数据库
- 在【ES6】的【Class】中编写属性的取值函数【get】和存值函数【set】时的三点注意事项
- 利用python进行数据分析之dataframe的常见操作
- Java基础2——基本程序设计
- 浅谈时间复杂度及空间复杂度的计算。