本文是“攻玉计划”的一部分,翻译自 https://stackoverflow.com/questions/35465557/how-to-apply-color-in-markdown

问题描述

我想用 Markdown 记录文字信息,但我搜了一圈 Google,发现 Markdown 不支持修改字体颜色。而且 StackOverflow 和 GitHub 的 Markdown 编辑模式也不支持指定文字颜色。

有什么办法可以在 Markdown 里指定文字颜色吗?

最佳答案

太长不看系列:

Markdown 自身并不支持色彩配置,但你可以在 Markdown 中添加 HTML 代码,例如:

1
<span style="color:blue">这是**蓝色**的文字</span>

以下是长回答:

根据官方的 语法规则

Markdown 只有一个用途,就是作为编写网页的一种语法格式。
Markdown 不能取代 HTML,甚至不能实现 HTML 的大部分功能。它的语法很简单,只能覆盖很小一部分的 HTML 标签。Markdown 并不是为了让你更方便地插入 HTML 标签。我的观点是,HTML 标签已经很方便了,而 Markdown 是为了让人更容易读、写、改。HTML 是用于发布的格式,而 Markdown 是给人写的格式。因此,Markdown的语法格式只用来处理可以用纯文本表达的信息。
对于任何 Markdown 未实现的功能,直接插入 HTML 代码即可。

由于 Markdown 并不是用来发布的格式,修改字体的颜色已经超出了 Markdown 的处理范围。但你仍可以插入裸的 HTML 代码(因为 HTML 是发布级的格式),例如以下 Markdown 文本:

1
包含 <span style="color:blue">*蓝色* 文字</span>的 Markdown 语句。

将会转换为以下 HTML 代码:

1
<p>包含 <span style="color:blue"><em>蓝色</em> 文字</span>的 Markdown 语句。</p>

目前,StackOverflow (也许 GitHub 也是)会把 HTML 代码原原本本地显示出来(因为安全性考虑),因此你无法在这些地方实现文字颜色的功能,但你可以在 Markdown 的任何标准实现中使用。

另一种解决方案是,直接使用 Markuru 的非标准属性表。此标准后续被 其它 一些人(可能还有其他类似理念的方案,比如 pandoc 中的 div 和 span 参数)继承开发。如果用了这种方案,你就可以为一段文字或者行内元素配置一个类,然后用 CSS 给这个类定义色彩属性。但显然,你必须使用支持这些非标准方案的编辑工具,并且这样写出来的文档也没法移植到其他系统上。

其他回答 1

如果你不想嵌入 HTML,只想用纯净的 Markdown 语句,可以尝试添加 emoji 以便强调指定语句。比如:⚠️警告⚠️,🔴重要❗🔴 或者 🔥新功能🔥。

其他回答 2

尽管 Markdown 不支持文字颜色属性,但你可以用 CSS 重定义一些格式标签,以便用它们来修改文字颜色。当然,你可以选择是否保留这些格式标签的原有属性。

例如:

1
2
3
4
5
6
7
8
// 重置标签属性
s { text-decoration: none; } // 删除线
em { font-style: normal; font-weight: bold; } // 斜体


// 增加颜色属性
s { color: green }
em { color: blue }

参见 如何使 em 标签标记粗体而不是斜体

然后,在 Markdown 文本中这样使用:

1
2
~~这是绿色~~
_这是蓝色_

其他回答 3

可以换个思路,你可以用各种颜色的 Unicode 字符以满足相关需求,比如 🔴,U+1F534(大红圈)。

举个例子,在我 GitHub 里的硬件项目中,我会用以下的字符以注明接线的颜色:

1
2
3
4
5
6
7
8
🔴 红色: +5V
🟠 橙色: +3.3V
⚫ 黑色: GND
⚪ 白色: GND (拉低)
🟣 紫色: I2C 信号线
🟢 绿色: 时钟信号
🟡 黄色: WS2812 信号
🔵 蓝色: 电阻桥(模拟)输入

这也许能帮到你,你可以直接复制粘贴上述字符到你的文档中,或者直接在网上搜例如“Unicode 紫色方块”之类。当然,它们也叫做 emoji。