【Markdown语法】字体颜色大小及文字底色设置

最新推荐文章于 2024-05-16 13:29:38 发布
置顶 最新推荐文章于 2024-05-16 13:29:38 发布
阅读量3.3w 收藏 385
点赞数 86
分类专栏： 其他 文章标签： 编辑器 csdn markdown 其他
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43732429/article/details/108034518
版权

Markdown字体颜色大小设置

一、更改字体、颜色、大小

1、Markdown语法

<font face="黑体">黑体字</font>
<font face="微软雅黑">微软雅黑</font>
<font face="STCAIYUN">华文彩云</font>
<font color=blue>蓝色</font>
<font color=#008000>绿色</font>
<font color=Red>红色</font>
<font size=5>尺寸</font>

<font face="黑体" color=green size=5>黑体，绿色，尺寸为5（任意内容）</font>

效果如下
黑体字
微软雅黑
华文彩云
蓝色
绿色
红色
尺寸
黑体，绿色，尺寸为5（任意内容）

    如果不需要改变输入内容的其他属性，比如加粗，斜体等，可以在内容前面加上<font color=颜色>即可。例如语句

    <font color=LightSeaGreen>某一种绿色

    效果如下：某一种绿色

    2、一些常用颜色

    color=NavajoWhite
    color=Feldspar
    color=SandyBrown
    color=LightSalmon
    color=Salmon
    color=LightCoral

    color=Pink
    color=PaleVioletRed
    color=HotPink

    color=silver
    color=LightSlateGray
    color=SlateGray
    color=grey
    color=RosyBrown
    color=maroon

    color=DarkSeaGreen
    color=LightSeaGreen
    color=SeaGreen

    color=PowderBlue
    color=LightSteelBlue
    color=CadetBlue
    color=navy

    color=Thistle
    color=Plum
    color=MediumPurple
    color=Purple

      3、文字底色

      借助 table, tr, td 等表格标签的 bgcolor 属性来实现背景色。将那一整行看作一个表格，更改整个格子的背景色（bgcolor）。

      Markdown语法：

      <table><tr><td bgcolor=DarkSeaGreen>这里的背景色是：DarkSeaGreen，此处输入任意想输入的内容</td></tr></table>

      现象：

      这里的背景色是：DarkSeaGreen，此处输入任意想输入的内容
      这里的背景色是：Beige，此处输入任意想输入的内容
      这里的背景色是：MistyRose，此处输入任意想输入的内容
      这里的背景色是：MistyRose，此处输入任意想输入的内容

      二、some tips

      1、强调

      *号或者_都可以，单个是斜体，双个是加粗。

      **凡有所学，皆成性格。**
__凡有所学，皆成性格。__

*凡有所学，皆成性格。*
_凡有所学，皆成性格。_

      凡有所学，皆成性格。
      凡有所学，皆成性格。
      凡有所学，皆成性格。
      凡有所学，皆成性格。

      2、放大加粗字体（类似于标题）

      Markdown语法

      <h1>想要放大的字体</h1>//h后面数字越大，字体越小
<h2>想要放大的字体</h2>
<h3>想要放大的字体</h3>
<h4>想要放大的字体</h4>
<h5>想要放大的字体</h5>

      效果如下：

      在这里插入图片描述

      3、分割线

      简单直接的方法：三个及以上-_*，必须单独一行，可含空格

      ---
***
___

      效果如下：

      Markdown语法

      <div class="footnotes"><hr><ol><li id="fn:wx"=>

      效果如下

        如果想自带标号（1,2,3等）：
        Markdown语法

        <div class="footnotes"><hr><ol><li id="fn:wx">想输入的内容①
</a></li><li id="fn:kz">想输入的内容②
</a></li><li id="fn:kz">想输入的内容③

        效果如下：

        1. 想输入的内容①
        2. 想输入的内容②
        3. 想输入的内容③

        4、文章转载

        • Markdown语法
        文章作者（任意想输入的汉字）, <a href="转载文章的网址">转载文章的名称</a>

        效果如下：

        Ω snow , 单片机学习（3）——数码管的显示+定时器+中断 ↩

        • 如果想加上↩，Markdown语法 如下：
        文章作者（任意想输入的汉字）, <a href="转载文章的网址">转载文章的名称</a> <a href="#fnref:wx" rel="nofollow" title="Return to article" class="reversefootnote">↩

        效果如下：

        Ω snow , 单片机学习（3）——数码管的显示+定时器+中断 ↩

        • 结合加上横线，文章转载。Markdown语法
        <div class="footnotes"><hr><ol><li id="fn:wx">文章作者1（任意想输入的汉字）, <a href="转载文章的网址">转载文章的名称</a>. <a href="#fnref:wx" rel="nofollow" title="Return to article" class="reversefootnote">↩</a></li>
<li id="fn:kz">文章作者2, <a href="文章的网址">文章名称</a> <a href="#fnref:kz" rel="nofollow" title="Return to article" class="reversefootnote">↩</a></li>
<li id="fn:wx2">文章作者3, <a href="http://blog.csdn.net/testcs_dn/article/details/45766819">文章名称</a> <a href="#fnref:wx2" rel="nofollow" title="Return to article" class="reversefootnote">↩</a></li>
</ol></div>

        效果如下：

        1. 文章作者1（任意想输入的汉字）, 转载文章的名称. ↩
        2. 文章作者2, 文章名称 ↩
        3. 文章作者3, 文章名称 ↩

        如果想继续增加标号，只需要重复这一段代码即可：

        <li id="fn:wx2">文章作者3, <a href="http://blog.csdn.net/testcs_dn/article/details/45766819">文章名称</a> <a href="#fnref:wx2" rel="nofollow" title="Return to article" class="reversefootnote">↩</a></li>

        5、文字加上粉色矩形框

        给文字或者代码加上粉色矩形框算是我本人写博客时比较偏爱的一种方式啦，尤其是在一堆文字里写上一句代码时，或者特地突出哪句话时，加上粉色矩形框就比较nice了，既能起到突出强调的作用，方便阅读，并且也比较美观（相比较黄色的高亮好太多了~）！

        首先输入模式改成英文的，然后 用两个反单引号`包裹需要粉色高亮的字体即可。反单引号在键盘的左上角，ESC键下方，Tab键上方。具体位置如下图：

        在这里插入图片描述

        附录：颜色列表

        附上转载自 CSDN-markdown编辑器语法——字体、字号与颜色 的颜色列表，按颜色名排序。

        颜色名十六进制颜色值颜色
        AliceBlue#F0F8FFrgb(240, 248, 255)
        AntiqueWhite#FAEBD7rgb(250, 235, 215)
        Aqua#00FFFFrgb(0, 255, 255)
        Aquamarine#7FFFD4rgb(127, 255, 212)
        Azure#F0FFFFrgb(240, 255, 255)
        Beige#F5F5DCrgb(245, 245, 220)
        Bisque#FFE4C4rgb(255, 228, 196)
        Black#000000rgb(0, 0, 0)
        BlanchedAlmond#FFEBCDrgb(255, 235, 205)
        Blue#0000FFrgb(0, 0, 255)
        BlueViolet#8A2BE2rgb(138, 43, 226)
        Brown#A52A2Argb(165, 42, 42)
        BurlyWood#DEB887rgb(222, 184, 135)
        CadetBlue#5F9EA0rgb(95, 158, 160)
        Chartreuse#7FFF00rgb(127, 255, 0)
        Chocolate#D2691Ergb(210, 105, 30)
        Coral#FF7F50rgb(255, 127, 80)
        CornflowerBlue#6495EDrgb(100, 149, 237)
        Cornsilk#FFF8DCrgb(255, 248, 220)
        Crimson#DC143Crgb(220, 20, 60)
        Cyan#00FFFFrgb(0, 255, 255)
        DarkBlue#00008Brgb(0, 0, 139)
        DarkCyan#008B8Brgb(0, 139, 139)
        DarkGoldenRod#B8860Brgb(184, 134, 11)
        DarkGray#A9A9A9rgb(169, 169, 169)
        DarkGreen#006400rgb(0, 100, 0)
        DarkKhaki#BDB76Brgb(189, 183, 107)
        DarkMagenta#8B008Brgb(139, 0, 139)
        DarkOliveGreen#556B2Frgb(85, 107, 47)
        Darkorange#FF8C00rgb(255, 140, 0)
        DarkOrchid#9932CCrgb(153, 50, 204)
        DarkRed#8B0000rgb(139, 0, 0)
        DarkSalmon#E9967Argb(233, 150, 122)
        DarkSeaGreen#8FBC8Frgb(143, 188, 143)
        DarkSlateBlue#483D8Brgb(72, 61, 139)
        DarkSlateGray#2F4F4Frgb(47, 79, 79)
        DarkTurquoise#00CED1rgb(0, 206, 209)
        DarkViolet#9400D3rgb(148, 0, 211)
        DeepPink#FF1493rgb(255, 20, 147)
        DeepSkyBlue#00BFFFrgb(0, 191, 255)
        DimGray#696969rgb(105, 105, 105)
        DodgerBlue#1E90FFrgb(30, 144, 255)
        Feldspar#D19275rgb(209, 146, 117)
        FireBrick#B22222rgb(178, 34, 34)
        FloralWhite#FFFAF0rgb(255, 250, 240)
        ForestGreen#228B22rgb(34, 139, 34)
        Fuchsia#FF00FFrgb(255, 0, 255)
        Gainsboro#DCDCDCrgb(220, 220, 220)
        GhostWhite#F8F8FFrgb(248, 248, 255)
        Gold#FFD700rgb(255, 215, 0)
        GoldenRod#DAA520rgb(218, 165, 32)
        Gray#808080rgb(128, 128, 128)
        Green#008000rgb(0, 128, 0)
        GreenYellow#ADFF2Frgb(173, 255, 47)
        HoneyDew#F0FFF0rgb(240, 255, 240)
        HotPink#FF69B4rgb(255, 105, 180)
        IndianRed#CD5C5Crgb(205, 92, 92)
        Indigo#4B0082rgb(75, 0, 130)
        Ivory#FFFFF0rgb(255, 255, 240)
        Khaki#F0E68Crgb(240, 230, 140)
        Lavender#E6E6FArgb(230, 230, 250)
        LavenderBlush#FFF0F5rgb(255, 240, 245)
        LawnGreen#7CFC00rgb(124, 252, 0)
        LemonChiffon#FFFACDrgb(255, 250, 205)
        LightBlue#ADD8E6rgb(173, 216, 230)
        LightCoral#F08080rgb(240, 128, 128)
        LightCyan#E0FFFFrgb(224, 255, 255)
        LightGoldenRodYellow#FAFAD2rgb(250, 250, 210)
        LightGrey#D3D3D3rgb(211, 211, 211)
        LightGreen#90EE90rgb(144, 238, 144)
        LightPink#FFB6C1rgb(255, 182, 193)
        LightSalmon#FFA07Argb(255, 160, 122)
        LightSeaGreen#20B2AArgb(32, 178, 170)
        LightSkyBlue#87CEFArgb(135, 206, 250)
        LightSlateBlue#8470FFrgb(132, 112, 255)
        LightSlateGray#778899rgb(119, 136, 153)
        LightSteelBlue#B0C4DErgb(176, 196, 222)
        LightYellow#FFFFE0rgb(255, 255, 224)
        Lime#00FF00rgb(0, 255, 0)
        LimeGreen#32CD32rgb(50, 205, 50)
        Linen#FAF0E6rgb(250, 240, 230)
        Magenta#FF00FFrgb(255, 0, 255)
        Maroon#800000rgb(128, 0, 0)
        MediumAquaMarine#66CDAArgb(102, 205, 170)
        MediumBlue#0000CDrgb(0, 0, 205)
        MediumOrchid#BA55D3rgb(186, 85, 211)
        MediumPurple#9370D8rgb(147, 112, 216)
        MediumSeaGreen#3CB371rgb(60, 179, 113)
        MediumSlateBlue#7B68EErgb(123, 104, 238)
        MediumSpringGreen#00FA9Argb(0, 250, 154)
        MediumTurquoise#48D1CCrgb(72, 209, 204)
        MediumVioletRed#C71585rgb(199, 21, 133)
        MidnightBlue#191970rgb(25, 25, 112)
        MintCream#F5FFFArgb(245, 255, 250)
        MistyRose#FFE4E1rgb(255, 228, 225)
        Moccasin#FFE4B5rgb(255, 228, 181)
        NavajoWhite#FFDEADrgb(255, 222, 173)
        Navy#000080rgb(0, 0, 128)
        OldLace#FDF5E6rgb(253, 245, 230)
        Olive#808000rgb(128, 128, 0)
        OliveDrab#6B8E23rgb(107, 142, 35)
        Orange#FFA500rgb(255, 165, 0)
        OrangeRed#FF4500rgb(255, 69, 0)
        Orchid#DA70D6rgb(218, 112, 214)
        PaleGoldenRod#EEE8AArgb(238, 232, 170)
        PaleGreen#98FB98rgb(152, 251, 152)
        PaleTurquoise#AFEEEErgb(175, 238, 238)
        PaleVioletRed#D87093rgb(216, 112, 147)
        PapayaWhip#FFEFD5rgb(255, 239, 213)
        PeachPuff#FFDAB9rgb(255, 218, 185)
        Peru#CD853Frgb(205, 133, 63)
        Pink#FFC0CBrgb(255, 192, 203)
        Plum#DDA0DDrgb(221, 160, 221)
        PowderBlue#B0E0E6rgb(176, 224, 230)
        Purple#800080rgb(128, 0, 128)
        Red#FF0000rgb(255, 0, 0)
        RosyBrown#BC8F8Frgb(188, 143, 143)
        RoyalBlue#4169E1rgb(65, 105, 225)
        SaddleBrown#8B4513rgb(139, 69, 19)
        Salmon#FA8072rgb(250, 128, 114)
        SandyBrown#F4A460rgb(244, 164, 96)
        SeaGreen#2E8B57rgb(46, 139, 87)
        SeaShell#FFF5EErgb(255, 245, 238)
        Sienna#A0522Drgb(160, 82, 45)
        Silver#C0C0C0rgb(192, 192, 192)
        SkyBlue#87CEEBrgb(135, 206, 235)
        SlateBlue#6A5ACDrgb(106, 90, 205)
        SlateGray#708090rgb(112, 128, 144)
        Snow#FFFAFArgb(255, 250, 250)
        SpringGreen#00FF7Frgb(0, 255, 127)
        SteelBlue#4682B4rgb(70, 130, 180)
        Tan#D2B48Crgb(210, 180, 140)
        Teal#008080rgb(0, 128, 128)
        Thistle#D8BFD8rgb(216, 191, 216)
        Tomato#FF6347rgb(255, 99, 71)
        Turquoise#40E0D0rgb(64, 224, 208)
        Violet#EE82EErgb(238, 130, 238)
        VioletRed#D02090rgb(208, 32, 144)
        Wheat#F5DEB3rgb(245, 222, 179)
        White#FFFFFFrgb(255, 255, 255)
        WhiteSmoke#F5F5F5rgb(245, 245, 245)
        Yellow#FFFF00rgb(255, 255, 0)
        YellowGreen#9ACD32rgb(154, 205, 50)
        Ω snow
        关注
        • 86
          点赞
        • 踩
        • 385
          收藏
          觉得还不错? 一键收藏
        • 9
          评论
        专栏目录
        markdown改变字体颜色及背景颜色
        kanglong129的博客
        02-26 9780
        字体颜色 $\color{red}{红色字}$ 效果: 其他方法: $\color{#FF0000}{红色字}$或$\color{rgb(255,255,0)}{黄色字}$ 效果: 字体背景色 由于 style 标签和标签的 style 属性都被和谐了（这让Markdown虽然有HTML的躯体，却没有HTML的灵魂！），所以这里只能是借助 table, tr, td 等表...
        Markdown语法大全（超级版）.pdf
        11-23
        Markdown语法大全（超级版） Markdown语法大全（超级版）是Markdown语法的全面指南，涵盖了Markdown的设计理念、内联HTML语法、特殊字符自动转义、行内语法、标题、任务列表、缩进、换行、空行、对齐方式、斜体、...
        Markdown编辑器常用颜色背景指南（附颜色与代码展示，cv即可用）
        YYDsis的博客
        12-17 2224
        本文记录了博主写markdown博客时常用的一些颜色指令
        【Markdown笔记】——设置markdown中文字的颜色
        一个做过前端开发的产品经理，经历过睿智产品的折磨导致脱发之后，励志要翻身"农奴"把歌唱，一边打入敌人内部一边持续提升自己，为我们广大开发同胞谋福祉，坚决抵制睿智产品折磨我们码农兄弟！
        04-29 1073
        Markdown是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档。它使用简单的符号和语法来表示标题、列表、链接、图片等元素，使得文档的格式和内容能够清晰地分离。
        Markdown骚操作｜字体颜色、字体背景、流程图一网打尽【建议收藏】_md文档给标题加颜色
        最新发布
        m0_60707221的博客
        05-16 532
        当我学到一定基础，有自己的理解能力的时候，会去阅读一些前辈整理的书籍或者手写的笔记资料，这些笔记详细记载了他们对一些技术点的理解，这些理解是比较独到，可以学到不一样的思路。Python所有方向的技术点做的整理，形成各个领域的知识点汇总，它的用处就在于，你可以按照下面的知识点去找对应的学习资源，保证自己学得较为全面。观看全面零基础学习视频，看视频学习是最快捷也是最有效果的方式，跟着视频中老师的思路，从基础到深入，还是很容易入门的。工具都帮大家整理好了，安装就可直接上手！
        Markdown字体颜色，大小，形式，背景色和表格语法详解
        小哨的博客
        02-08 3897
        Markdown好用的一些标记技巧---字体颜色、大小、样式、背景色、表格
        Markdown 文字添加颜色方法总结｜CSDN编辑器测评
        CodeAllen嵌入式
        08-10 3万+
        学习交流加（可免费帮忙下载CSDN资源）： 个人微信：coderAllen 学习交流资源分享①群：736386324 Markdown的语法简洁明了、学习容易，而且功能比纯文本更强，因此有很多人用它写博客。世界上最流行的博客平台WordPress和大型CMS如Joomla、Drupal都能很好的支持Markdown。完全采用Markdown编辑器的博客平台有Ghost和Typecho。 用于...
        markdown编辑器语法——文字颜色、大小、字体与背景色的设置
        一步一个脚印
        12-15 8万+
        CSDN的markdown编辑器是其衍生版本，扩展了Markdown的功能（如表格、脚注、内嵌HTML等等）就是内嵌HTML，接下来要讲的功能就需要使用内嵌HTML的方法来实现。一、颜色浅红色文字：<font color="#dd0000">浅红色文字：</font><br /> 深红色文字：<font color="#660000">深红色文字</font><br /> 浅绿色文字：<font
        Markdown 更改字体颜色
        嵌入式Stark
        09-01 1796
        color=red 更改字体颜色 (颜色也可以直接写 red green blue 等)face=“黑体” 更改字体。size= 7 更改字体大小。
        怎么在markdown中设置字体颜色为红色
        m0_61629312的博客
        11-05 1872
        需要注意的是，这种方式使用了HTML标签，所以在一些Markdown编辑器中可能需要开启或启用HTML标签的支持。除了使用HTML标签，Markdown还提供了一种更简洁的方式来设置文本样式，包括颜色。所有，可以使用Markdown的扩展语法来实现。属性为"red"来指定字体颜色为红色。2023年11月5日，周日上午。
        MarkDown字体颜色——MarkDown学习笔记
        01-07
        2）输入需要标注颜色的文字 3）输入 （注意：实际上里面没有空格，只为示意用的） 示例：我是啥颜色 十六进制颜色值查询：https://blog.csdn.net/testcs_dn/article/details/45719357/#comments Tips: 十六进制颜色...
        markdown语法记录文档
        02-04
        Markdown 语法记录文档涵盖了 Markdown 语法的所有方面，包括插入标题、字体、超链接、插入图片、代码、列表及表格等常见使用方法。 插入标题 Markdown 语法中的标题可以通过使用井号 (#) 来表示，一个 # 代表一级...
        markdown-字体颜色
        01-31
        markdown-字体颜色
        markdown语法.md
        08-24
        md
        Markdown语法之字体，字号，颜色以及背景！
        木子偉
        03-25 1248
        Markdown语法的字体，字号，颜色以及背景！瞬间让你的文章炫酷无比！
        Markdown之设置字体、粗体、颜色、居中显示等(十二)
        Android系统攻城狮
        04-03 1755
        本篇目的：Markdown之设置字体、粗体、颜色、居中显示等操作。
        Markdown (CSDN) MD编辑器（四）- 漂亮表格(表格背景色、跨行、跨列、多行)
        wkd_007的博客
        04-28 2万+
        markdown的表格语法简单，功能也简单，有时表格需要设置背景色、跨行、跨列，markdown支持内嵌HTML的语法，所以可以用 HTML 表格来实现这样的需求。
        【md】1.markdown基础语法
        qq_51929253的博客
        11-01 5511
        一些简单的markdown语法
        Markdown进阶（更改字体、颜色、大小，设置文字背景色，调整图片大小设置居中）
        热门推荐
        heimu24的博客
        07-24 29万+
        基础知识： Markdown 通过简单标记语法，使普通文本内容具有一定格式。但它本身不支持修改字体、字号与颜色等功能的。CSDN-markdown 编辑器是其衍生版本，支持基于 PageDown ( Stack Overflow）所使用的编辑器的扩展功能（如表格、脚注、内嵌HTML、内嵌 LaTeX 等等）。 Size：规定文本的尺寸大小，取值从 1 到 7 ，浏览器默认值是 3...
        vue动态表格行的新增
        10-16
        在Vue中，可以通过v-for指令和响应式数据来实现动态表格行的新增。以下是一种实现方式： 首先，在Vue组件的data选项中定义一个数组（比如叫做tableData），用于存储表格的数据。这个数组的初始值可以为空，也可以包含一些默认的表格行数据。 然后，在template中，使用v-for指令遍历tableData数组，将每个元素渲染成表格的一行。例如： ```html <table> <tr v-for="item in tableData" :key="item.id"> <td>{{ item.name }}</td> <td>{{ item.age }}</td> <!-- 其他列的数据 --> </tr> </table> ``` 接下来，当需要新增表格行时，可以通过点击按钮或其他交互方式来触发一个方法（比如叫做addTableRow），在这个方法中向tableData数组中添加一个新的行数据。例如： ```html <button @click="addTableRow">新增表格行</button> ... methods: { addTableRow() { // 创建一个新的行数据对象 const newTableRow = { id: this.tableData.length + 1, name: '', age: 0, // 其他列的数据 }; // 向tableData数组添加新的行数据 this.tableData.push(newTableRow); } } ``` 在上述代码中，addTableRow方法会创建一个新的行数据对象，并将其添加到tableData数组中。由于tableData是响应式的，所以当数组发生变化时，表格的视图会自动更新，新增的行会被渲染出来。 以上就是使用Vue实现动态表格行新增的一个简单示例。当点击新增按钮时，会动态地添加一行空白的表格行。你可以根据实际需求来修改和扩展这个示例。

        “相关推荐”对你有帮助么？

        • 非常没帮助
        • 没帮助
        • 一般
        • 有帮助
        • 非常有帮助
        提交
        评论 9
        添加红包

        请填写红包祝福语或标题

        个

        红包个数最小为10个

        元

        红包金额最低5元

        当前余额3.43元 前往充值 >
        需支付：10.00元
        成就一亿技术人!
        领取后你会自动成为博主和红包主的粉丝 规则
        hope_wisdom
        发出的红包
        实付元
        使用余额支付
        点击重新获取
        扫码支付
        钱包余额 0

        抵扣说明：

        1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
        2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

        余额充值