我想做个博客网站，怎么让网站支持markdown写法？
[问题点数：30分，结帖人tingliu5517]
本版专家分：201
CSDN今日推荐
本版专家分：482
本版专家分：201
本版专家分：10
结帖率 100%
本版专家分：1053
2017年6月 Java大版内专家分月排行榜第三
本版专家分：201
匿名用户不能发表回复！|
CSDN今日推荐你永远不会知道， 你今天的努力会带来什么样的结果。
Markdown - 写作的博客神器，没有之一
一、什么是Markdown?
通常可以这样理解，对于网络上写作的人，Markdown 是 一种text-to-html (文本到 html)的转换工具。它提供给你一种方便阅读、方便书写的纯文本格式，然后把纯文本转换成符合语意并且结构化良好的 HTML 或者 XHTML.
事实上，如同一样，Markdown 同样是一种 Markup Language(标记语言)。只不过，Markdown 是更轻量级的、对书写和阅读更友好的标记语言。也正是为了达成这样的目标， 和 才创造了 Markdown.
标记语言也好，工具也好，Markdown 只关注两件事情，以真正实现易读易写的目标：
格式化的纯文本语法；John Gruber 用 Perl 开发的脚本工具将纯文本转换成格式化的 HTML.
这对于网络写作的人而言，他只需要专注在文字，而不必纠结文章的 HTML 标签如何结构化，怎样让文章展现的更好看，更可读，同样对于网站的设计者和开发者，他只需要关注网站基本元素的样式实现，比如 headers，links，而不必担心整体的网站版式会被一个个作者自定义的样式搞的不伦不类。
二、为什么推荐 Markdown？
既然 Markdown 这么爽，那 UX 里面发布博客完全可以采用这种形式，虽然目前后台编辑器中暂不直接支持 Markdown 语法，但支持源代码，这就够了。
利用各种 Markdown 编辑利器书写
将 Markdown 写的 blog 导出为 HTML;
用编辑器打开 HTML 文件，拷贝其中 &body&&/body& 两个标签中的源代码到后台编辑器，打开源码格式，粘贴进去即可。
三、Markdown 相关的工具
任何一个经常跟文章打交道的人，尤其是团队/个人 blog, 项目文档的组织，都应该尝试使用如下工具，当然，跟 Markdown 搭边的大都是免费资源；
编辑器类：
for Mac(最好用的，没有之一) for Windows for windows for windows for Linux for Mac - $9.99去谷姐问问其他
在线工具类：
online online online有众多的在线工具，你可以选如果你想要把一个网站都转成 Markdown,
可以让你轻松做到，或者看看。当然，对于前端攻城湿而言，github 的
无疑是一个文档分享和记录的好地方，这里你尽情使用 Markdown。
for chrome for ,这里有详细的
for Mac - $3.99,提供给你 Markdown 的预览功能，不管你用什么文本编辑器。
四、怎么上手 Markdown？
谨记，如果在 Windows 平台，不要使用 Word,而使用
类似这样的文本编辑器。Mac 系统下没有内置的文本编辑器，因此我上面推荐的
Mac 就派上用场了，你可以呼出 Mou help 打开语法提示窗口，同时在 Mou 中的左侧窗口书写 Markdown 文章，加以标记的点缀，右侧的窗口能实时的看到展现的效果。如下图：
Markdown 基本语法
Markdown 标题，段落，引用
这是一级页头标题
=============
这是二级页头标题
-------------
所有从事网络写作的人都应该尽快尝试上手 Markdown,它不仅会提高你的工作效率，更会让你专注于写作本身，保证文章的质量。这只是一个普通的段落.
这是另一个普通的段落.
& 这是一个段落引用.
& 这是引用中的第二段.
输出的 HTML 结构：
&A First Level Header&
&A Second Level Header&
&所有从事网络写作的人都应该尽快尝试上手 Markdown,它不仅会提高你的工作效率，更会让你专注于写作本身，保证文章的质量。这只是一个普通的段落.&
&这是另一个普通的段落。&
&这是三级页头标题&
&这是一个段落引用.&
&这是引用中的第二段.&
&这是引用段落中的一个二级标题&
Markdown 加粗和强调
一对星号一个段落中的*被强调的文字*.
某些文字被 _强调_.
双星号实现**加粗**.
或者, 双下划线, 实现__同样加粗的效果__.
输出的 HTML 结构：
&一对星号一个段落中的&被强调的文字&.
某些文字被 &强调&。&
&双星号实现&加粗&.
或者, 双下划线, 实现&同样加粗的效果&。&
Markdown 删除线
首尾各用两个波浪线:
~~无效内容~~
生成的 HTML 结构：
Markdown 强制断行
正常，回车后形成的断行，不会被 Markdown 解析为断行，需要在断行前面段落后加两个空格:
这里是一个段落，断行处1
回车换到了第二行，生成的 HTML 是不会断行的。
同样这个段落，断行处2
在断行处2后面增加两个空格 就达到强制断行的效果了。
~~无效内容~~
生成的 HTML 结构：
Markdown 列表
无序列表的 Markdown，使用 *, +, - 同样效果
输出同样的 HTML 结构：
有序列表则使用正常的阿拉伯数字即可：
输出的 HTML 结构：
如果在列表之间隔开空行，同时缩进 4 个空格或者 1 个tab, 则会生成列表包含 p 标签的复杂的结构：
忙着改需求的的 PD
输出的 HTML 结构：
&忙着改需求的的 PD&&
Markdown 链接
Markdown 支持两种链接构造方式：
内敛式引用式
内敛式 Markdown 语法是直接将链接地址附在链接文本之后：
这是 [UX 平台链接](http:
输出的 HTML 结构：
href="http://ux.etao.com"&UX 平台链接&
另外，也可以给链接制定 title 属性：
这是 [UX 平台链接](http:
输出的 HTML 结构：
href="http://ux.etao.com" title="UX 体验工作平台"&UX 平台链接&
引用式 Markdown 语法是文档其它地方定义好 链接常量，直接引用即可，同事放括号内不区分大小写，如：
UX 平台最新的技术博客分别是 [KISSY RichBase 使用][1]，[Mix网站低调上线][2] 和 [清空当前页面的用户体验][c]。
[1]: http:
[2]: http:
[C]: http:
输出的 HTML 结构：
&UX 平台最新的技术博客分别是
href="http://ux.etao.com/posts/613"&KISSY RichBase 使用&， href="http://ux.etao.com/posts/598"&Mix网站低调上线& 和
href="http://ux.etao.com/posts/580"&清空当前页面的用户体验&。&
Markdown 还支持自动链接，即只需要尖括号包起来，就会自动转成链接，在引述和书写邮箱的时候很便捷。
Markdown 图片
图片跟链接十分类似，只是链接文本前面多了一个叹号 ！。也分为内敛式 和 引用式：
![alt text][4]
[4]: http://img02.taobaocdn.com/tps/i2/T13yQPXa4cXXaJKhPp-1638-1136.png "Markdown Tips"
上面这两种都输出同样的 HTML 结构：
src="http://img02.taobaocdn.com/tps/i2/T13yQPXa4cXXaJKhPp-.png" alt="alt text" title="Markdown Tips" /&
目前 Markdown 让人不爽的是，还不支持制定图片宽高，如果需要，要使用普通的 &img& 标签。
Markdown Tables
一个简单的示例如下：
First Header | Second Header | Third Header
Content Cell | Content Cell
| Content Cell
Content Cell | Content Cell
| Content Cell
对于每个表格，你如果愿意，也都可以加上表头分割线：
| First Header | Second Header | Third Header |
| Content Cell | Content Cell
| Content Cell |
| Content Cell | Content Cell
| Content Cell |
输出的 HTML 结构：
&First Header&
&Second Header&
&Third Header&
&Content Cell&
&Content Cell&
&Content Cell&
&Content Cell&
&Content Cell&
&Content Cell&
还通过冒号为每个列制定对其方向：
First Header | Second Header | Third Header
:----------- | :-----------: | -----------:
输出的 HTML 结构：
align="left"&First Header&
&Second Header&
align="right"&Third Header&
align="left"&Left&
align="right"&Right&
align="left"&Left&
align="right"&Right&
Markdown 代码区块
在需要展示代码片段的时候，Markdown 可以让你以多种方式在多种场景下展现源代代码。在普通的段落中，对某个代码前后加反撇号就可以生成 code 片段：
在书写 HTML 时，我不推荐使用 `&` 标签
输出的 HTML 结构：
&在书写 HTML 时，我不推荐使用 &&font&& 标签&
对于大块的成段的源代码展现，则每行缩进 4 个空格即可：
在 HTML5 中，`&!DOCTYPE&` 声明方式只有一种：
&!DOCTYPE html&
lang=“zh_CN”&
&Everything about UX&
输出的 HTML 结构：
&在 HTML5 中，&&!DOCTYPE&& 声明方式只有一种：&
&&&!DOCTYPE html&
&html lang=“zh_CN”&
&title&UX&/title&
&p&Everything about UX&/p&
Markdown 隔离的代码块
这是一个代码块，与前面的代码区块不同之处有两点：
不依赖于缩进段落首尾分别使用三个反撇号。 这是被隔离的代码快，跟缩进代码块达到同样的效果。
Markdown 分割线
在文档中建立分割线的方式，就是用三个以上的星号，减号，或者下划线，除了空格，不允许出现其它符号。如下写法效果等同：
输出的 HTML 结构：
Markdown 特殊字符自动转换
在 HTML 文件中，有两个字符需要特殊处理： & 和 & 。 & 符号用于起始标签，& 符号则用于标记 HTML 实体，如果你只是想要显示这些字符的原型，你必须要使用实体的形式，像是 & 和 &。 Markdown 让你可以自然地书写字符，需要转换的由它来处理好了。如果你使用的 & 字符是 HTML 字符实体的一部分，它会保留原状，否则它会被转换成 &。
所以你如果要在文档中插入一个版权符号 (C)，你可以这样写：
Markdown 会保留它不动。而若你写：
Markdown 就会将它转为：
Markdown 转义
Markdown使用 反斜线对如下字符进行转义，来适用需要用到有意义符号的场景：
减号 （连字符）
五、Markdown 深入了解
如果你想了解更多的 Markdown 的应用场景与相关文档，下面这些可供参考：
的博客和评论系统使用的是 Markdown。 这是它们的 。 同样倾情于使用自定义的混合 Markdown 用于它们的讨论组。 这是它们的。
参考文档：
没有更多推荐了，　　Markdown是一种可以使用普通文本编辑器编写的标记语言，通过类似HTML的标记语法，它可以使普通文本内容具有一定的格式。Markdown的语法简洁明了、学习容易，而且功能比纯文本更强，因此有很多人用它写博客。
　　最近开发项目，客户也要求后台加入MarkDown编辑功能，下面就来分享一下关于MarkDown的研究成果。
&一、MarkDown简介及其基本语法
&　　考虑到有些人之前可能没了解过markdown或者关于markdown的语法已经忘了差不多了，同时也为了自己以后有个参考，所以这里就再把markdown常用的基本语法再敲一边，如果经常使用markdown的人可以直接跳过这一节。
1、MarkDown简介
　　Markdown 是一种轻量级的「标记语言」，它的优点很多，目前也被越来越多的写作爱好者，撰稿者广泛使用。看到这里请不要被「标记」、「语言」所迷惑，Markdown 的语法十分简单。常用的标记符号也不超过十个，这种相对于更为复杂的 HTML 标记语言来说，Markdown 可谓是十分轻量的，学习成本也不需要太多，且一旦熟悉这种语法规则，会有一劳永逸的效果。
　　用markdown编写完后，我们可以导出到html发布到网站或者导出pdf保存到本地，十分的方便。最重要的是markdown源文件是纯文本文件，也就是意味着可以跨平台，使用 Markdown 的优点如下：
专注你的文字内容而不是排版样式，安心写作。
轻松的导出 HTML、PDF 和本身的 .md 文件。
纯文本内容，兼容所有的文本编辑器与字处理软件。
随时修改你的文章版本，不必像字处理软件生成若干文件版本导致混乱。
可读、直观、学习成本低。
&这里先给大家推荐一款我最喜欢的MarkDown在线编辑器，CmdMarkDown,网址为：https://www.zybuluo.com/mdeditor，大家可以先在这里学习基本语法。
2.MarkDown基本语法
标题是每篇文章都需要也是最常用的格式，在 Markdown 中，如果一段文字被定义为标题，只要在这段文字前加 # 号即可。
# 一级标题 & & //对应html标签&h1&
## 二级标题 &&//对应html标签&h2&
### 三级标题&//对应html标签&h3&
以此类推，总共六级标题，建议在井号后加一个空格，这是最标准的 Markdown 语法。
这里要注意的是#和后面的内容之间要有空格隔开。
2)粗体和斜体
Markdown 的粗体和斜体也非常简单，用两个 * 包含一段文本就是粗体的语法，用一个 * 包含一段文本就是斜体的语法。
*Markdow* &//斜体
**Markdow** &//粗体
分割线也比较简单，markdown语法为：
这里的列表指的就是我们html中常用的有序列表和无序列表，及&ul&和&ol&.这里不再给出截图，大家可以自己动手实践。
其语法如下：
无序列表：
* 1 &或者 - 1 &或者 + 1&
* 2 &或者 - 2&&或者 + 2&
* 3 &或者 - 3&&或者 + 3&
这里要注意的是有使用*就都是用*号，使用 '-' 就都用 '-' 号，混合使用会出错的。还有就是* 和内容之间要加一个空格。
有序列表比较简单，写法如下：
&当然，这里前面的序号可以随便写，总之后面会得到与之相同的输出。
如果你需要引用一小段别处的句子，那么就要用引用的格式。引用的语法就是在文字前面加 & ,如：
& 这里是引用
输出如下：
当然，不同的markdown编辑器输出的显示略有不同.
超链接的写法比较特殊，但是也很好记忆，如我们加一个百度的超链接，markdown语法如下：
[百度](http://www.baidu.com)
当我们导出到html中时，就会得到一个&a&标签的输出。
如果我们要加入一张图片，其语法如下：
跟文字链接相比，也就是前面多了一个感叹号！。
markdown的表格我感觉写起来并不是那么简便，我们先来看一下表格的写法：
| ------------- |:-------------:| -----:|
| col 3 is
| right-aligned | $1600 |
| col 2 is
| centered
| zebra stripes | are neat
显示结果如下：
这里值得注意的是第二行，|:------------:|,这里两边加冒号就是居中，如果只有一边加冒号就是哪边对齐，如Cool那一列就是右对齐。默认左对齐。
&8) 代码框
&程序员写东西，难免会插入一些代码，在&Markdown下实现也非常简单，只需要用两个 ` 把中间的代码包裹起来，代码的语法如下：
& -- 代码内容-- &
&注意这里的`不是单引号，而是键盘左边那个~上的`。
&二、打造自己的MarkDown编辑器
&　　上面说了那么多，都是markdown的基本语法，下面我们开始说怎么让自己的网站后台支持markdown，首先，我们必须要明白一点的是，之所以在网站中可以使用markdown是因为markdown可以导出html，所以我们做的就是把markdown转换成html就ok了。
　　关于markdown转换成html，网上已经有开源的js库了，我们没有必要再去重复造轮子，这里我们使用开源项目showdown.js：
GitHub地址为：https://github.com/showdownjs/showdown
这个插件使用方法十分简单，使用方法如下：
最后一行代码，makeHtml()这个方法会返回导出的html代码，然后我们将其显示出来就可以了。
下面我们下载showdownjs，放到本地，写一个demo来测试一下，我们新建一个html文件，添加js引用，代码如下：
&!DOCTYPE html&
&title&MarkDown&/title&
&script type="text/javascript" src="showdown.min.js"&&/script&
&然后，我们添加一个&textare&用来输入markdown内容，再添加一个div来显示markdown的输出结果。然后，编写javascript代码，取出用户输入的内容，然后把导出的html代码显示在div中，整体页面代码如下：
&!DOCTYPE html&
&title&MarkDown&/title&
&script type="text/javascript" src="showdown.min.js"&&/script&
font-family: "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
font-size: 16px;
line-height: 1.;
color: #333;
background-color: #fff;
line-height: 24px;
blockquote {
border-left:#eee solid 5px;
padding-left:20px;
color:#D34B62;
background: #F9F2F4;
&textarea id="content" style="height:400width:600" onkeyup="compile()"&&/textarea&
&div id="result"&&/div&
&script type="text/javascript"&
function compile(){
var text = document.getElementById("content").
var converter = new showdown.Converter();
var html = converter.makeHtml(text);
document.getElementById("result").innerHTML =
这里我们给&textare&添加onkeyup事件，这样就可以实时的看到编辑结果了。页面运行效果如下：
这里我加了一些css样式对显示结果进行渲染，这样看起来会好看一些，大家可以根据输出的html标签，然后自己添加css样式进行渲染，这里我简单写了一下，修改了引用和代码的样式。
&有一点遗憾的是，貌似这个showdownjs不支持table。
QQ交流群：
&博客地址：http://www.cnblogs.com/yunfeifei/
&声明：本博客原创文字只代表本人工作中在某一时间内总结的观点或结论，与本人所在单位没有直接利益关系。非商业，未授权，贴子请以现状保留，转载时必须保留此段声明，且在文章页面明显位置给出原文连接。
如果大家感觉我的博文对大家有帮助，请推荐支持一把，给我写作的动力。
阅读(...) 评论()MWeb – 专业的 Markdown 写作、记笔记、静态博客生成软件
MWeb – 专业的 Markdown 写作、记笔记、静态博客生成软件
专业的 Markdown 写作支持
极简 UI、Dark Mode、漂亮的 Markdown 语法高亮、列表缩进优化，提供 5 种主题选择。
除了支持基本的 Markdown 语法外，还支持大量 Markdown 扩展语法：Table、TOC、MathJax、Fenced code block、任务列表（Task lists）、顺序图和流程图、Footnote 等。
专业的 Markdown 写作支持
极简 UI、Dark Mode、漂亮的 Markdown 语法高亮、列表缩进优化，提供 5 种主题选择。
除了支持基本的 Markdown 语法外，还支持大量 Markdown 扩展语法：Table、TOC、MathJax、Fenced code block、任务列表（Task lists）、顺序图和流程图、Footnote 等。
支持 Typewriter Scrolling（打机滚动模式）View – Typewriter Scrolling。
支持发布和更新到：Wordrpess 博客、支持 Metaweblog API 的博客服务、Wordpress.com、Evernote 和印象笔记、Blogger、Tumblr。请在Preferences – Publishing 增加发布服务，然后点击软件右上角的分享按钮即可看到所增加的发布服务。
支持即时预览并提供 6 种预览主题，其中二种和静态博客主题相对应，也就是说您在写博客时可以即时预览大概效果！所有主题效果都支持导出为 HTML、PDF。快捷键 CMD + R 或 CMD + 4 打开即时预览窗口。
编辑器和实时预览都支持大纲视图，长文档时跳转非常方便。
设计为两种模式
外部文档模式：用于新建、打开和编辑外部 Markdown 文档。也支持引入外部文件夹到 MWeb 中管理。
文档库模式：用分类树管理文档，可以把文档设为多个分类，用于记笔记和静态网站生成。
CMD + E 或使用菜单 View – Open External 可打开外部文档模式。
CMD + L 或使用菜单 View – Open Library 可打开文档库。
文档库模式和外部模式都支持全文搜寻（Full Text Search），都可以用拖放或粘贴插入图片并直接显示。CMD + V 粘贴为JPG格式，CMD + Shift + V 粘贴为PNG透明格式。
外部模式引入 Octpress、Jekyll 等静态博客的文件夹后也支持拖放或粘贴插入图片和实时预览，详细请参考：
文档库模式用于记笔记
文档库模式使用分类树组织和管理文档，支持拖放或粘贴插入图片并直接显示，插入非图片则会生成连结。
支持把 Markdown 或文本文档导入到文档库，也支持把整个分类或者文档（可选多个）导出为 HTML、PDF、Markdown。
更详细的信息请看：
文档库模式用于静态博客生成
一键把分类生成静态博客，目前可选二个主题，支持自定主题。只要填入 Disqus、多说提供的代码即可以为博客增加评论功能。可勾选让网站支持 MathJax 和顺序图、流程图。
用云栖社区APP，舒服~
【云栖快讯】云栖社区技术交流群汇总，阿里巴巴技术专家及云栖社区专家等你加入互动，老铁，了解一下？&&
通过在客户自己的数据中心内交付完整的阿里云软件堆栈，阿里云专有云帮助政企客户向混合云架构平滑...
由轻量级Agent和云端组成，集云盾威胁情报于一体，通过Agent和云端大数据的联动，为您提...
为您提供简单高效、处理能力可弹性伸缩的计算服务，帮助您快速构建更稳定、安全的应用，提升运维效...怎么用markdown写博客？
<a data-traceid="question_detail_above_text_l&&
都是怎么用markdown写博客的啊，有好的工具推荐没？
Atom& _(:з」∠)_
只要是文本编辑器都可以，我一般用vim&
开源中国技术博客 就有 Markdown 编辑器～