首页 > 代码库 > 笔记-Markdown常用语法
笔记-Markdown常用语法
其实应该很早就已经接触到了Markdown这种简洁却彪悍的标记语言,比如Github的README.md,只不过被不走心的我当作txt文档来用了。直到前个看到一位大神的读书列表清单,觉得很新奇,就有意识地查阅了一些语法,瞬间被吸引到了。本文便记录部分常用的语法。
1、标题 #
<!-- MD -->## this is heading level 2<!-- HMTL --><h2>this is heading level 2</h2>
2、列表
(1)无序列表 +/-/*
<!-- MD -->* Fruit + Apple + Banana + Orange* Food* Animal<!-- HMTL --><ul><li>Fruit <ul><li>Apple</li> <li>Banana</li> <li>Orange</li></ul></li><li>Food</li><li>Animal</li></ul>
(2)有序列表 数字.
<!-- MD -->1. Apple1. Banana1. Orange<!-- HMTL --><ol> <li>Apple</li> <li>Banana</li> <li>Orange</li></ol>
3、引用 >
<!-- MD -->> I hope this post proves helpful to someone else that encounters the problem.> > It was almost as frustrating to find the culprit the second time … <!-- HTML --><blockquote> <p>I hope this post proves helpful to someone else that encounters the problem.</p> <blockquote> <p>It was almost as frustrating to find the culprit the second time … </p> </blockquote></blockquote>
4、代码块 `
<!-- MD -->```javascripttestData = http://www.mamicode.com/‘ - time:‘ + new Date().getTime() + ‘ <br> ‘;localStorage.setItem("test", testData);```<!-- HTML --><pre><code class="javascript">testData = http://www.mamicode.com/‘ - time:‘ + new Date().getTime() + ‘ <br> ‘;localStorage.setItem("test", testData);</code></pre>
5、强调 */_
<!-- MD -->This is the *emphasis* code. and That is the most **important** part.<!-- HTML --><p>This is the <em>emphasis</em> code. and That is the most <strong>important</strong> part.</p>
6、超链接 [text] (url title) / [text] [id] .. [id]: url title
(1)内联方式:
<!-- MD -->This is [inline-link](http://daringfireball.net/projects/markdown/dingus "Title-md demo") inline link.<!-- HTML --><p>This is <a href="http://daringfireball.net/projects/markdown/dingus" title="Title-md demo">inline-link</a> inline link.</p>
(2)引用方式:
<!-- MD -->This is [ref-link] [ref-1] reference-style link.[ref-1]: http://daringfireball.net/projects/markdown/dingus "Title-md demo"<!-- HTML --><p>This is <a href="http://daringfireball.net/projects/markdown/dingus" title="Title-md demo">ref-link</a> reference-style link.</p>
7、图片 ![text] (url title) -- 两种方式同超链接
<!-- MD -->![Alt text](/path/to/img.jpg "Optional title")<!-- HTML --><img alt="Alt text" src="/path/to/img.jpg" title="Optional title">
8、图片 :name:
<!-- MD -->:+1:<!-- HTML --><img align="absmiddle" alt=":+1:" class="emoji" height="20px" src="https://assets-cdn.github.com/images/icons/emoji/unicode/1f44d.png" title=":+1:" width="20px">
9、脚本引用 [^id]
<!-- MD -->Footnotes[^fnote-1] are added in-text like so ...[^fnote-1]: Footnotes are detailed explanation. There are always long conents in the footnotes.<!-- HTML --><p>Footnotes<sup id="fnref:fnote-1"><a class="footnote-ref" href="#fn:fnote-1" rel="footnote">1</a></sup> are added in-text like so …</p><div class="footnote"> <hr> <ol> <li id="fn:fnote-1"> <p>Footnotes are detailed explanation.<br> There are always long conents in the footnotes. <a class="footnote-backref" href="#fnref:fnote-1" rev="footnote" title="Jump back to footnote 1 in the text">?</a></p> </li> </ol></div>
附:使用sublime预览MD文件
安装 :
Ctrl + Shift + P | PCI | Markdown Preview
预览快捷键:(Package Control Messages [To preview] 说明)
{ "keys": ["alt+m"], "command": "markdown_preview", "args": {"target": "browser", "parser":"markdown"} }
参考:
https://daringfireball.net/projects/markdown/syntax
https://rephrase.net/box/word/footnotes/syntax/
http://www.cnblogs.com/hnrainll/p/3514637.html
http://blog.csdn.net/kaitiren/article/details/38513715
http://www.webpagefx.com/tools/emoji-cheat-sheet/
https://www.macstories.net/roundups/sublime-text-2-and-markdown-tips-tricks-and-links/
笔记-Markdown常用语法