我有一个自述文件。md文件用于我的项目underscore-cli,我想记录——color标志。
目前,做到这一点的唯一方法是截图(可以存储在项目存储库中):
但截图不是文本,防止读者复制/粘贴截图中的命令。创建/编辑/维护它们也很麻烦,而且浏览器加载速度较慢。现代网络使用文本样式,而不是一堆渲染的文本图像。
虽然一些Markdown解析器支持内联HTML样式,但GitHub不支持;这行不通:
<span style="color: green"> Some green text </span>
这行不通:
<font color="green"> Some green text </font>
问题是“如何在github readme中为文本上色”
哪一个是困难的/不可能的
跑题:在github的问题上,我们可以用
<span color="red">red</span>
例子:
#!/bin/bash
# Convert ANSI-colored terminal output to GitHub Markdown
# To colorize text on GitHub, we use <span color="red">red</span>, etc.
# Depends on:
# aha: convert terminal colors to html
# xclip: copy the result to clipboard
# License: CC0-1.0
# Note: some tools may need other arguments than `--color=always`
# Sample use: colors-to-github.sh diff a.txt b.txt
cmd="$1"
shift # now the arguments are in $@
(
echo '<pre>'
$cmd --color=always "$@" 2>&1 | aha --no-header
echo '</pre>'
) \
| sed -E 's/<span style="[^"]*color:([^;"]+);"/<span color="\1"/g' \
| sed -E 's/ style="[^"]*"//g' \
| xclip -i -sel clipboard
在GitHub README中为文本着色。md,可以使用SVG <text>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 55 20" fill="none">
<text x="0" y="15" fill="#4285f4">G</text>
<text x="12" y="15" fill="#ea4335">o</text>
<text x="21" y="15" fill="#fbbc05">o</text>
<text x="30" y="15" fill="#4285f4">g</text>
<text x="40" y="15" fill="#389738">l</text>
<text x="45" y="15" fill="#ea4335">e</text>
</svg>
在使用自定义颜色制作自定义文本之后,保存SVG文件并按照以下步骤操作。
在GitHub上打开你的存储库。
单击README.md的“编辑”按钮
将SVG文件拖放到打开的在线编辑器中。GitHub将生成一个降价图像。大致如下。
(谷歌)! (https://user-images.githubusercontent.com/000/000-aaa.svg)
如果您想改变SVG的原始大小,可以使用生成的URL作为<img/>标记的src,并给出所需的大小。
<img height="100px" src="https://user-images.githubusercontent.com/000/000-aaa.svg" alt=""/> .
我倾向于同意M-Pixel的观点,目前不可能在GitHub Markdown内容中为文本指定颜色,至少不能通过HTML。
GitHub确实允许一些HTML元素和属性,但只允许某些元素和属性(参见他们的HTML消毒文档)。他们允许p和div标签,以及颜色属性。然而,当我尝试在GitHub上的Markdown文档中使用它们时,它不起作用。我尝试了以下方法(在其他变体中),但它们都不起作用:
<p style='color:red'>这是一些红色的文字
<font color="red">这是一些文字!< / font >
这些是<b style='color:red'>红色单词</b>。
正如M-Pixel所建议的,如果你真的必须使用颜色,你可以在README.html文件中这样做,并将它们引用到它。