《简书攻略》:妙用简书Markdown彩色文字,提升文章阅读体验

简书Markdown编辑器默认使用黑色的文字,但是有时候我们想使用更多颜色来表达某种语义,或者是为了增强文字的视觉冲击力,或者为了区分某种层次关系等等。那么,仅仅用黑色就显得相当单调乏味。但是,我们也可以使用Markdown编辑器中的特殊语法让文字变成彩色,大幅度提升文章的阅读体验。在人脑每天接受的信息中,文字占比只有11%,而图像却高达75%以上,所以文章视觉美化的重要性,你懂得!正所谓耳目一新,或是一见钟情。
语法: $\color{ 颜色表示法 } { 文字 }$
比如,我想让自己的名字变成彩色:
,用到的颜色代码为
$\color{ red } { AT阿宝哥 }$
。
,用到的颜色代码为
$\color{ #00FF00 } { AT阿宝哥 }$
。
,用到的颜色代码为
$\color{ rgb(0 , 0 , 255 ) } { AT阿宝哥 }$
。
在网页中,按照W3C标准,有如下几种颜色表示法:
- 颜色名
- 十六进制颜色值
- RGB( R , G , B)表示法
- RGBA(R,G,B,A)表示法
- HSL(H,S,L)表示法
- HSLA(H,S,L,A)表示法
本文中重点演示颜色名、十六进制颜色值和RGB表示法这三种。RGBA、HSL和HSLA表示法对于非专业人士,可能不易理解和使用。
1、颜色名
W3C的 html 4.0 标准仅支持 16 种颜色名,它们是:aqua、black、blue、fuchsia、gray、green、lime、maroon、navy、olive、purple、red、silver、teal、white、yellow。
当然,大多数浏览器支持更多的颜色名。更多具体颜色名,请参考《阿宝哥的HTML5笔记》之06:颜色名 ,此处不做赘述了。
$\color{Red}{红色}$
$\color{Green}{绿色}$
$\color{Blue}{蓝色}$
2、十六进制颜色值
颜色由一个十六进制符号来定义,这个符号由红色、绿色和蓝色的值组成(RGB)。每种颜色的最小值是0(十六进制:#00)。最大值是255(十六进制:#FF),这样就能表示16581375中颜色。
语法:#RRGGBB
- RR为红色值。十六进制正整数
- GG为绿色值。十六进制正整数
- BB为蓝色值。十六进制正整数
$\color{#FF0000}{红色}$
$\color{#00FF00}{绿色}$
$\color{#0000FF}{蓝色}$
更多具体十六进制颜色值,请参考《阿宝哥的HTML5笔记》之06:颜色名 ,此处不做赘述了。
3、RGB( R , G , B)表示法
颜色由RGB( R , G , B)函数来定义,RGB()为函数名称,R、G、B三个参数分别代表红色、绿色和蓝色分量。每种颜色的最小值是0(十进制),最大值是255(十进制),这样就能表示16581375中颜色。
语法:RGB( R , G , B)
- R为红色值。十进制正整数
- G为绿色值。十进制正整数
- B为蓝色值。十进制正整数
$\color{ rgb( 255 , 0 , 0) }{红色}$
$\color{ rgb( 0, 255 , 0) }{绿色}$
$\color{ rgb( 0, 0 , 255) }{蓝色}$
4、配色表
划重点,计算机中的颜色是根据红、绿和蓝三个颜色分量混合而成,具体合成为哪种颜色,关键看红绿蓝三基色的数值大小,颜色表示法只是书写形式而已。所以,颜色表示法是不是特别像个数字调色板呢?
更多具体颜色名和十六进制颜色值,请参考《阿宝哥的HTML5笔记》之06:颜色名 ,此处不做赘述了。
5、深入研究
我们打开浏览器的开发者模式后,跟踪变色的文字,发现其实质上是简书根据颜色代码将修饰的文字自动转换成彩色图片。这意味着我们将无法改变被修饰文字的大小,以及当一篇文章中有多张彩色文字图片时将会影响加载的性能。如果读者是用手机在阅读文章,那么,这些图片势必会额外消耗手机流量。当然,当下的手机流量,土豪的您都是G级别的套餐,碎碎个事!

6、防盗攻略
经常看到简村很多才华横溢的作者辛辛苦苦写了一篇美文,却被一些千夫指的盗者擅自署名发表了,令人真是气愤!究其原因,这些盗者都是利欲熏心、好吃懒做之流,毫无道德和法律底线。此处AT阿宝哥分享下个人的防盗攻略,当然,这只是防范,但是不能杜绝。好比我们只能给家门装锁,但是不能杜绝盗者暴力撬门。
敲黑板,划重点。比如,我写了一段文字,使用简书Markdown彩色文字效果修饰:
因为上面我们已经讲过,被修饰的文字都被简书自动转换成了图片,这意味着盗者只能拷贝图片。另外,您还可以在被修饰的文字中加入署名或者特殊字符等,对文章内容进行混淆。这样,盗者想在别的地方发表,会增加其编辑的难度和时间成本。
当然,对于内容较长的文章,一定程度上确实给盗者增加了复制难度,但也增加了作者的编辑难度。这种情况下,建议您使用手机简书的“文章生成图片”功能,将文章转换成图片再发表。
如果,您有更好的建议和方法,请不吝评论分享,我们一起让自己变得更棒,让简村变得更好。
7、操作指南
7.1、电脑操作
- 确保您的编辑器是MarkDown编辑器,而非富文本编辑器。在PC上的简书编辑器左下角,依此点击
设置--默认编辑器--MarkDown编辑器
。

2.新建一篇文章,在编辑器中输入彩色文字相关内容,并单击红色圆圈处切换到预览模式查看效果。

实例内容,可以直接鼠标选中复制:
$\color{ red } { AT阿宝哥 }$
$\color{ #00FF00 } { AT阿宝哥 }$
$\color{ rgb(0 , 0 , 255 ) } { AT阿宝哥 }$
- 预览效果。

7.2、手机操作
- 确保您的手机简书的编辑器是MarkDown编辑器,而非富文本编辑器。依此点击
我的--设置--默认编辑器--MarkDown编辑器
。

- 新建一篇文章,在编辑器中输入彩色文字相关内容,并单击“预览”切换到预览模式查看效果。

- 预览效果。

愿本文对你有所帮助,祝您梦想成真!
🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗🤗