众所周知,有序/无序列表在阅读模式下会自动与上文空出一行,在某些情况下会造成逻辑上的割裂,虽然这是markdown的特性,但可以通过css样式来迂回解决。
使用方法:
- 通过调整top来调整高度,负值越小高度越高,建议不要超过你的一行的高度
- 通过调整left来调整缩进,正值越大缩进越大,依照自己喜好调整
实现原理:实际上并没有消除自动添加的空行,只是把列表/表格显示上移了,覆盖在空行上了,也算是一种迂回路线了
css代码:
/* 控制段落与表格间的距离 */
.el-p + .el-table {
margin-top: -30px; /* 上边距 */
}
/* 控制标题与表格间的距离 */
[class^="el-h"] + .el-table {
margin-top: 0px; /* 上边距 */
}
/* 控制段落与列表间的距离与缩进 */
.el-p + .el-ol,
.el-p + .el-ul {
margin-top: -30px; /* 上边距 */
padding-left: 20px; /* 缩进 */
}
/* 控制标题与列表间的距离 */
[class^="el-h"] + .el-ol,
[class^="el-h"] + .el-ul {
margin-top: 0px; /* 上边距 */
padding-left: 20px; /* 缩进 */
}
使用前:
使用后:

