如何在Markdown中应用颜色?

时间:2016-02-17 19:09:19

标签: markdown

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

是否有任何降价标记允许彩色文字?

13 个答案:

答案 0 :(得分:233)

作为原始/官方syntax rules州(强调添加):

  

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

     

Markdown不是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采用(可能会有更多,或略有不同实现相同的想法,如div and span attributes in pandoc)。在这种情况下,您可以将一个类分配给段落或内联元素,然后使用CSS来定义类的颜色。但是,您绝对必须使用实际支持非标准功能的少数实现之一,并且您的文档不再可移植到其他系统。

答案 1 :(得分:33)

当您要使用纯Markdown(无嵌套HTML)时,可以使用Emojis来吸引人们注意文件的某些片段,例如⚠️警告⚠️,?重要❗?或??。

答案 2 :(得分:30)

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

因此,这种颜色文本标记是“很好”。我使用过这样的几个并且效果很好。

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

变成这是蓝色斜体。

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

变成这是红色加粗。

我喜欢灵活性和易用性。

答案 3 :(得分:9)

我喜欢重新定义未使用的现有标签的想法,因为文本更干净,但牺牲了现有标签。内联样式有效,但在阅读原始文本时会产生很多噪音。

使用 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 应用内笔记记录,但我想它可能在其他地方工作?

答案 4 :(得分:3)

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

示例:

// resets
s { font-style: normal; } //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

答案 5 :(得分:2)

这应该更短:

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

答案 6 :(得分:2)

Date Issue 08/25/14 Making/receiving payments, sending money None 04/20/17 Other 02/14/14 Billing disputes 08/30/13 Managing the loan or lease 10/03/14 Billing disputes 01/07/13 Billing disputes 中,我可以为粗体元素添加一些颜色或其他样式(也应与所有其他元素一起使用)。

我以Jekyll开始“样式”,并以{:结尾。元素和大括号之间不允许有空格!

}

将被翻译成html:

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

答案 7 :(得分:2)

似乎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类:

  

blue类应用于文本:

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

blue类应用于标题:

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

应用两个类:

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

应用ID:

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

这将产生:

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

above link中还介绍了许多其他内容。您可能需要检查。

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

答案 8 :(得分:2)

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

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)

答案 9 :(得分:1)

我成功了

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

注意:该类必须已经存在于站点上。

答案 10 :(得分:0)

这在笔记乔普林中起作用:

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

答案 11 :(得分:0)

您可能可以使用乳胶样式:

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

要保持单词之间的空白,还需要包括波浪号~

答案 12 :(得分:0)

在 zeppelin 段落中运行以下代码

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