Markdown编辑器使用-yellowcong

本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦：

目录

‘[TOC]’标签需要和

• Markdown和扩展Markdown简洁的语法
• 代码块高亮
• 图片链接和图片上传
• LaTex数学公式
• UML序列图和流程图
• 离线写博客
• 导入导出Markdown文件
• 丰富的快捷键

---

TOC标签使用

TOC是一个目录生成的MarkDown标签，使用的时候，需要有一个上级目录，然后使用[TOC]就可以自动生成目录了

#目录[TOC]

MarkDown 图片和链接以及文字

图片

图片的显示和链接类似，不同的是，MarkDown语法中，图片前面多了一个! [图片描述](图片地址)

例子

 <!--markdown中图片显示--> ![图片描述](图片地址)

首行缩进

对于Markdown编辑器来说，对于中文不是特别的方便，需要通过html的代码，来实现首行缩进的操作

半方大的空白  或 全方大的空白  或 不断行的空白格  或 

标题背景颜色

背景颜色,yellowcong背景颜色,yellowcong背景颜色,yellowcong背景颜色,yellowcong背景颜色,yellowcong背景颜色,yellowcong背景颜色,yellowcong背景颜色,yellowcong

对于markdown来说，他不支持直接写背景，但是我们可以通过table这个标签中的的td标签，设定 bgcolor这个属性来设定显示的颜色

<table><tr><td bgcolor="#48525E"><font color="white"><big>背景颜色,yellowcong</big><small>背景颜色,yellowcong</small></font></td></tr><tr><td bgcolor="red"><font color="white"><big>背景颜色,yellowcong</big><small>背景颜色,yellowcong</small></font></td></tr><tr><td bgcolor="blue"><font color="white"><big>背景颜色,yellowcong</big><small>背景颜色,yellowcong</small></font></td></tr></table>

字体大小

字体大小,yellowcong字体大小,yellowcong对于markdown来说，字体大小通过font属性设置，并不好，可以使用big和small标签，可以解决字体大小问题。

<big>背景颜色,yellowcong</big><small>背景颜色,yellowcong</small>

链接

语法

 <!--markdown中图片显示--> [链接名称](http://www.baidu.com)

例子

百度

字体、字号与颜色图片居中

    <font face="黑体">我是黑体字</font>      <font face="微软雅黑">我是微软雅黑</font>      <font face="STCAIYUN">需要粘贴的内容</font>      <font color=#0099ff size=7 face="黑体">需要粘贴的内容</font>      <font color=#00ffff size=72>需要粘贴的内容</font>      <font color=#DC143C size=4> 需要粘贴的内容</font>   

Size：规定文本的尺寸大小。可能的值：从 1 到 7 的数字。浏览器默认值是 3。

颜色名列表

颜色表，是通过table标签写的背景， 不是直接出来的

方法说明颜色名称颜色 此处实现方法利用 CSDN-markdown 内嵌 html 语言的优势Hotpinkrgb(240, 248, 255) 借助 table, tr, td 等表格标签的 bgcolor 属性实现背景色设置AntiqueWhitergb(255, 192, 203)

<table><tbody>    <tr>        <th>方法说明</th><th>颜色名称</th><th>颜色</th>    </tr>    <tr>        <td><font color="Hotpink">此处实现方法利用 CSDN-markdown 内嵌 html 语言的优势</font></td><td><font color="Hotpink">Hotpink</font></td><td bgcolor="Hotpink">rgb(240, 248, 255)</td>    </tr>    <tr>        <td><font color="Pink">借助 table, tr, td 等表格标签的 bgcolor 属性实现背景色设置</font></td><td><font color="pink">AntiqueWhite</font></td><td bgcolor="Pink">rgb(255, 192, 203)</td>    </tr></table>

MarkDown图片居中

MarkDown显示图片,直接显示的时候，不能调节图片的大小和位置，需要使用Html的语法来解决问题

MarkDown显示语法的方法

 <!--markdown中图片显示--> ![图片](http://avatar.csdn.net/A/6/B/3_yelllowcong.jpg)

显示效果

Html中图片显示

<!--这个地方，不知道为啥，直接写就会导致下面的样式变了，所以在前面，后面，加上 &nbsp; (空格符)，就会没有问题--> <div align="center">     <img src="http://avatar.csdn.net/A/6/B/3_yelllowcong.jpg" width = "100" height = "100" alt="图片名称" /></div><!--实际代码-->&nbsp;<div align="center">    <img src="http://avatar.csdn.net/A/6/B/3_yelllowcong.jpg" width = "100" height = "100" alt="图片名称" /></div>&nbsp;

显示效果

 

 

最常用的字符实体(Character Entities)

在MarkDown中，注释小段代码可以使用 `注释的类容` 三个 `，可以进行段落的注释 ，对于一些html的字符，使用这个方法，可以很好的解决这些问题

显示结果 说明 Entity Name Entity Number   显示一个空格     < 小于 < < > 大于 > > & &符号 & & “ 双引号 " "

快捷键

名称 快捷键 加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl + Q 插入链接 Ctrl + L 插入代码 Ctrl + K 插入图片 Ctrl + G 提升标重点内容题 Ctrl + H 有序列表 Ctrl + O 无序列表 Ctrl + U 横线 Ctrl + R 撤销 Ctrl + Z 重做 Ctrl + Y

Markdown及扩展

Markdown 是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档，然后转换成格式丰富的HTML页面。 —— [ 维基百科 ]

使用简单的符号标识不同的标题，将某些文字标记为粗体或者斜体，创建一个链接等，详细语法参考帮助？。

本编辑器支持 Markdown Extra , 　扩展了很多好用的功能。具体请参考Github.

表格

Markdown　Extra　表格语法：

项目 价格 Computer $1600 Phone $12 Pipe $1

可以使用冒号来定义对齐方式：

项目 价格 数量 Computer 1600 元 5 Phone 12 元 12 Pipe 1 元 234

定义列表

Markdown　Extra　定义列表语法：

项目１

项目２

定义 A

定义 B

项目３

定义 C

定义 D

定义D内容

代码块

代码块语法遵循标准markdown代码，例如：

@requires_authorizationdef somefunc(param1='', param2=0):    '''A docstring'''    if param1 > param2: # interesting        print 'Greater'    return (param2 - param1 + 1) or Noneclass SomeClass:    pass>>> message = '''interpreter... prompt'''

脚注

生成一个脚注1.

数学公式

使用MathJax渲染LaTex 数学公式，详见math.stackexchange.com.

• 行内公式，数学公式为：Γ(n)=(n−1)!∀n∈N。
• 块级公式：

x=−b±b2−4ac−−−−−−−√2a

更多LaTex语法请参考 这儿.

UML 图:

可以渲染序列图：

或者流程图：

• 关于 序列图 语法，参考 这儿,
• 关于 流程图 语法，参考 这儿.

离线写博客

即使用户在没有网络的情况下，也可以通过本编辑器离线写博客（直接在曾经使用过的浏览器中输入write.blog.csdn.net/mdeditor即可。Markdown编辑器使用浏览器离线存储将内容保存在本地。

用户写博客的过程中，内容实时保存在浏览器缓存中，在用户关闭浏览器或者其它异常情况下，内容不会丢失。用户再次打开浏览器时，会显示上次用户正在编辑的没有发表的内容。

博客发表后，本地缓存将被删除。　

用户可以选择 把正在写的博客保存到服务器草稿箱，即使换浏览器或者清除缓存，内容也不会丢失。

注意：虽然浏览器存储大部分时候都比较可靠，但为了您的数据安全，在联网后，请务必及时发表或者保存到服务器草稿箱。

浏览器兼容

1. 目前，本编辑器对Chrome浏览器支持最为完整。建议大家使用较新版本的Chrome。
2. IE９以下不支持
3. IE９，１０，１１存在以下问题
   
   1. 不支持离线功能
   2. IE9不支持文件导入导出
   3. IE10不支持拖拽文件导入

颜色参考

颜色名十六进制颜色值颜色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)

---

---

1. 这里是 脚注 的 内容. ↩