如何在 Markdown 中对文本应用颜色

问题描述 投票:0回答:9

我想使用Markdown来存储文本信息。但快速谷歌搜索显示 Markdown 不支持颜色。另外 Stack Overflow 不支持颜色。与 GitHub markdown 的情况相同。

是否有允许彩色文本的 Markdown 风格?

markdown
9个回答
981
投票

TL;博士

Markdown 不支持颜色,但您可以在 Markdown 中内联 HTML,例如:

<span style="color:blue">some *blue* text</span>.

更长的答案

作为原始/官方语法规则状态(添加强调):

Markdown 的语法只有一个目的:用作网络写作的格式。

Markdown 并不能替代 HTML,甚至不能替代 HTML。它的语法非常小,仅对应于 HTML 标签的一个非常小的子集。我们的想法并不是创建一种可以更轻松地插入 HTML 标签的语法。在我看来,HTML 标签已经很容易插入了。 Markdown 的想法是让阅读、写作和编辑散文变得容易。 HTML 是一种发布格式; Markdown 是一种写作格式。因此,Markdown 的格式化语法仅解决可以用纯文本表达的问题

对于 Markdown 语法未涵盖的任何标记,您只需使用 HTML 本身即可。

由于它不是一种“发布格式”,因此提供一种为文本着色的方法超出了 Markdown 的范围。也就是说,这并非不可能,因为您可以包含原始 HTML(HTML 是一种发布格式)。例如,以下 Markdown 文本(如 @scoa 在评论中建议的):

Some Markdown text with <span style="color:blue">some *blue* text</span>.

将生成以下 HTML:

<p>Some Markdown text with <span style="color:blue">some <em>blue</em> text</span>.</p>

现在,StackOverflow(可能还有 GitHub)将剥离原始 HTML(作为安全措施),因此您会丢失此处的颜色,但它应该适用于任何标准 Markdown 实现。

另一种可能性是使用最初由 Markdown 的 Markuru 实现引入的非标准属性列表,后来被 few others 采用(同一想法可能有更多或略有不同的实现,例如 pandoc 中的 div 和 span 属性)。在这种情况下,您可以将类分配给段落或内联元素,然后使用 CSS 为类定义颜色。但是,您绝对必须使用实际支持非标准功能的少数实现之一,并且您的文档不再可移植到其他系统。


249
投票

当您想使用纯 Markdown(没有嵌套 HTML)时,您可以使用 Emojis 来引起对文件某些片段的注意,即 ⚠️WARNING⚠️、🔴IMPORTANT❗🔴 或 🔥NEW🔥。


81
投票

我已经开始使用 Markdown 将我的一些文档发布到内部网站供内部用户使用。这是共享文档但查看者无法编辑文档的简单方法。

所以,这种彩色文本标记是“很棒的”。我已经使用了几个这样的并且效果非常好。

<span style="color:blue">some *This is Blue italic.* text</span>

变成 这是蓝色斜体。

还有

<span style="color:red">some **This is Red Bold.** text</span>

变成这是红色粗体。

我喜欢灵活性和易用性。


70
投票

我喜欢重新定义现有标签(如果由于文本更清晰而未使用它们)的想法,但会牺牲现有标签。内联样式有效,但在阅读原始文本时会产生很多噪音。

使用 VSCode,我发现自定义单字母标签由顶部的小

<style>
部分支持,可以很好地减少噪音,特别是对于专色,例如

<style>
r { color: Red }
o { color: Orange }
g { color: Green }
</style>

# TODOs:

- <r>TODO:</r> Important thing to do
- <o>TODO:</o> Less important thing to do
- <g>DONE:</g> Breath deeply and improve karma

我的用例是在开发过程中进行 orgmode 风格的应用内笔记,但我想它可能在其他地方也适用?


49
投票

虽然 Markdown 不支持颜色,但如果你不需要太多,你总是可以牺牲一些支持的样式并使用 CSS 重新定义相关标签以使其具有颜色,并删除格式,或者不。

示例:

// resets
s { text-decoration:none; } //strike-through
em { font-style: normal; font-weight: bold; } //italic emphasis


// colors
s { color: green }
em { color: blue }

另请参阅:如何将 em 标签重新设置为粗体而不是斜体

然后在你的 Markdown 文本中

~~This is green~~
_this is blue_

45
投票

作为替代方案,无论文本中的颜色有什么用途,都可以使用彩色 Unicode 字符来实现,例如🔴、U+1F534“大红色圆圈”。

例如,当我在 GitHub 上记录电线颜色、硬件伴随我的软件项目时,我会使用这样的字符。

🔴 red: +5V
🟠 orange: +3.3V
⚫ black: ground
⚪ white: ground (pull-down)
🟣 purple: I2C signal
🟢 green: clock signal
🟡 yellow: WS2812 signal
🔵 blue: resistor bridge (analogue) input

也许这对您的文档也很有用。您可以将此示例复制并粘贴到文本中,或者在网络上搜索“unicode Purple square”等字符串。它们也被认为是表情符号。


44
投票

这应该更短:

<font color='red'>test blue color font</font>

24
投票

你也许可以使用乳胶风格:

$\color{color-code}{your-text-here}$

要保留单词之间的空格,您还需要包含波浪号

~


19
投票

现在,自 2022 年 5 月起,Github 可以在 Markdown 上使用 LATEX,您可以使用 LATEX 代码在您的存储库上使用某种颜色,如下例所示:

基本

代码 出现
$${\color{red}Red}$$
$$
© www.soinside.com 2019 - 2024. All rights reserved.