如何在 Markdown 中应用颜色?

How to apply color in Markdown?

我想用Markdown来存储文字信息。但是快速谷歌搜索说 Markdown 不支持颜色。 Whosebug 也不支持颜色。与 GitHub 降价的情况相同。

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

TL;DR

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

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

更长的答案

作为 original/official syntax rules 状态(强调已添加):

Markdown’s syntax is intended for one purpose: to be used as a format for writing for the web.

Markdown is not a replacement for HTML, or even close to it. Its syntax is very small, corresponding only to a very small subset of HTML tags. The idea is not to create a syntax that makes it easier to insert HTML tags. In my opinion, HTML tags are already easy to insert. The idea for Markdown is to make it easy to read, write, and edit prose. HTML is a publishing format; Markdown is a writing format. Thus, Markdown’s formatting syntax only addresses issues that can be conveyed in plain text.

For any markup that is not covered by Markdown’s syntax, you simply use HTML itself.

由于它不是一种“发布格式”,因此提供一种为文本着色的方法超出了 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>

现在,Whosebug(可能还有 GitHub)将去除原始的 HTML(作为安全措施),所以你在这里失去了颜色,但它应该适用于任何标准的 Markdown 实现。

另一种可能性是使用最初由 Markuru implementation of Markdown and later adopted by a few others (there may be more, or slightly different implementations of the same idea, like div and span attributes in pandoc) 引入的非标准属性列表。在这种情况下,您可以将 class 分配给段落或内联元素,然后使用 CSS 为 class 定义颜色。但是,您绝对必须使用实际支持非标准功能的少数实现之一,并且您的文档不再可移植到其他系统。

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

所以,这个彩色文本标记是“很棒”。我用过几个这样的,效果很好。

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

变成This is Blue italic.

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

变成This is Red Bold.

我喜欢它的灵活性和易用性。

虽然 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 }

另请参阅:How to restyle em tag to be bold instead of italic

然后在你的降价文本中

~~This is green~~
_this is blue_

这适用于 note-taking 乔普林:

<span style="color:red">text in red</span>

这应该更短:

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

Jekyll 中,我能够向 粗体 元素添加一些颜色或其他样式(也应该与所有其他元素一起使用)。

我以 {: 开始 "styling" 并以 } 结束。元素和大括号之间不允许有 space!

**My Bold Text, in red color.**{: style="color: red; opacity: 0.80;" }

将被翻译成 html:

<strong style="color: red; opacity: 0.80;">My Bold Text, in red color.</strong>

似乎 kramdown 支持某种形式的颜色。

Kramdown allows inline html:

This is <span style="color: red">written in red</span>.

它还有另一种语法 including css classes inline:

This is *red*{: style="color: red"}.

This 页面进一步解释了 GitLab 如何利用更紧凑的方式在 Kramdown 中应用 css 类:

Applying blue class to text:

This is a paragraph that for some reason we want blue.
{: .blue}

Applying blue class to headings:

#### A blue heading
{: .blue}

Applying two classes:

A blue and bold paragraph.
{: .blue .bold}

Applying ids:

#### A blue heading
{: .blue #blue-h}

This produces:

<h4 class="blue" id="blue-h">A blue heading</h4>

above link 上还有很多其他的解释。您可能需要检查一下。

此外,正如其他答案所说,Kramdown 也是 default markdown renderer behind Jekyll。因此,如果您在 github 页面上创作任何内容,上述功能可能是开箱即用的。

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

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

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

当你想使用纯 Markdown(没有嵌套 HTML)时,你可以使用 Emojis 来引起对文件某些片段的注意,即 ⚠️WARNING⚠️, 重要❗ 或 .

我已经成功了

<span class="someclass"></span>

注意:class 必须已经存在于网站上。

短篇小说:链接。使用类似的东西:

a[href='red'] {
    color: red;
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}
<a href="red">Look, ma! Red!</a>

(HTML 以上用于演示目的)

并且在您的 md 源中:

[Look, ma! Red!](red)

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

使用 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-ish 应用程序内笔记,但我想它可能在其他地方也适用?

运行飞艇段落中的以下内容

%md ### <span style="color:red">text</span>

在 RMarkdown 中输入 header 这个命令

header-includes: \usepackage{xcolor}

然后使用此命令为文本着色

\textcolor{green}{Text is green!}

屁股痛。

通过 pandoc 降价到 PDF 仅在使用时对我有用:

---
header-includes: 
                 \usepackage{xcolor}
                 \definecolor{alizarin}{rgb}{0.82, 0.1, 0.26}
---

\color{alizarin}The overarching aim \color{black} of this project is

红色为“总体目标”- 其余为黑色。字体保持不变,没有空格问题。

导出到 odt 或 docx - 运气不好。

作为替代方案,无论颜色在文本中的用途如何,都可以使用彩色 Unicode 字符来实现,例如 , U+1F534 'large red circle'.

例如,当我在 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' 等字符串。它们也被认为是表情符号。

请使用以下语法将粗体和字体颜色设置为红色

__`A`__