本页介绍了管理空白渲染的方法。 演示网站如何处理空白,说明常见的 实现所需格式的技术、陷阱和解决方法。
插入换行符
###默认换行行为
代码
什么是
*起来*?
你好吗?结果
什么是 起来?
你好吗?
行尾有两个空格
代码
你好
那里结果
你好
那里
注意:这是Markdown功能;请注意,该行补充“Hello”之后没有填充空格。
行尾有两个反斜杠
代码
会发生什么\
如果我们使用反斜杠?结果
会发生什么\ 如果我们使用反斜杠?
注意:这是kramdown功能;请注意,该行的“发生后面”后面包含一个空格,因为我们在反斜杠之前包含一个空格。
使用显式
代码
*狮子*<br>和**老虎**结果
狮子
和老虎
文本文本
大多数字体都是宽度的,因此您不能依赖多行排列的字符:
代码
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+\\
| -=-=- 初始化无敌-=-=- |\\
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+结果
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+
| -=-=- 初始化无敌-=-=- |
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+
通过代码栅栏对齐
如果需要固定宽度的字体,可以使用代码宽度:
代码
```
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+
| -=-=- Initializing Invincibility -=-=- |
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+
```结果
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+
| -=-=- Initializing Invincibility -=-=- |
+-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=+
通过跨度造型
如果您真的只想要固定宽度的字体,而不需要额外的样式,
您可以在周围的 <span> 元素上使用 style 属性:
代码
<span style="font-family: monospace">
+-=-=-=-=-=-=-=-=-=-=-=-=-+\\
| -=- I'm *Invincible!* -=- |\\
+-=-=-=-=-=-=-=-=-=-=-=-=-+
</span>结果
+-=-=-=-=-=-=-=-=-=-=-=-=-+
| -=- I’m Invincible! -=- |
+-=-=-=-=-=-=-=-=-=-=-=-=-+
但如果您在块级 HTML 元素(例如 <div>)上执行此操作,您将无法再在 Markdown 中混合:
代码
你要做什么,让我流血?
<div style="font-family: monospace">
+-=-=-=-=-=-=-=-=-=-=-=-=-+\\
| -=- I'm *Invincible!* -=- |\\
+-=-=-=-=-=-=-=-=-=-=-=-=-+
</div> You're a loony.结果
你要做什么,让我流血?
You’re a loony.
…除非您将 markdown=1 添加到相关元素中:
代码
你要做什么,让我流血?
<div style="font-family: monospace" markdown=1>
+-=-=-=-=-=-=-=-=-=-=-=-=-+\\
| -=- I'm *Invincible!* -=- |\\
+-=-=-=-=-=-=-=-=-=-=-=-=-+
</div> You're a loony.结果
你要做什么,让我流血?
+-=-=-=-=-=-=-=-=-=-=-=-=-+
| -=- I’m Invincible! -=- |
+-=-=-=-=-=-=-=-=-=-=-=-=-+
You’re a loony.
…或wrap the Markdowny parts in a
<span markdown=1>。
连续多个空格
通常,多个空格会被压缩为一个:
代码
这真是一件大事!结果
这真是一件大事!
如果您希望保留多余的空格,请使用 HTML 的 代码:
代码
这真是一件大事!结果
这真是一件大事!
##防止在空白处换行
通常,只要有空格,行就可以换行:
代码
Lorem ipsum dolor sat amet、consectetur adipiscing elit、sed do eiusmod tempor
incididunt ut laboure et dolore Magna aliqua。 Ut enim ad minim veniam, quis
Nostrud 实习 ullamco Laboris nisi ut aliquip ex ea commodo consequat。
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
Exceteur sint occaecat cupidatat 非 Proident,sunt in
我所经历的失落是我们对工作的不满。结果
Lorem ipsum dolor sat amet、consectetur adipiscing elit、sed do eiusmod tempor incididunt ut laboure et dolore Magna aliqua。 Ut enim ad minim veniam, quis Nostrud 实习 ullamco Laboris nisi ut aliquip ex ea commodo consequat。 Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu Exceteur sint occaecat cupidatat 非 Proident,sunt in 我所经历的失落是我们对工作的不满。
如果你不希望它在特定的位置换行,可以使用 代替常规空格,但对于上述的整个段落,它很快就会变得令人厌烦。另一种方法是使用样式跨度:
代码
<span style="white-space: nowrap">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
culpa qui officia deserunt mollit anim id est laborum.
</span>结果
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
注意前导空格
如果您使用三个以上的空格来进行压缩,Markdown 处理器会认为您指的是代码块:
代码
它可以缩进4个空格而不需要前面导空行:
although you may be surprised that it continues on the same line.
但如果您在空行后缩进4个空格,请注意:
Markdown kicks in, treating it as a block of code.
即使后续行没有缩进!结果
它可以缩进4个空格而不需要前面导空行: although you may be surprised that it continues on the same line. 但如果您在空行后缩进4个空格,请注意: Markdown kicks in, treating it as a block of code. 即使后续行没有缩进!