Markdown
What is markdown ?
A lightweight markup language which formats content by its simple syntax.
Why markdown ?
Eveywhere, for everything.
Websites like Reddit, Github, etc. support markdown. Documents, notes, books, emails and so on support markdown. WYSIWYG files are mostly only supported by its own editor.Human readable. Markdown files are in plain text which is human readable. WYSIWYG files are not.
Portable. As markdown files are written in plain text, it can be created on any device, any operating system. And almost all platforms supports rendering of markdown.
Kicking the tires
Online editor: Dillinger
Client editor: Marktext, a realtime rendering editor
Syntax
Basic
Element | Syntax |
---|---|
Heading | # Heading 1 ## Heading 2 ### Heading 3 |
Bold | **bold text** |
Italic | *Italic* |
Blockquote | > blockquote |
List | 1. First Item 2. Second Item 3. Third Item - First Item - Second Item - Third Item |
Code | `code` |
Horizontal rule | --- |
Link | [title](https://www.example.com) |
Image | ![alt text](image.jpg) |
Extended
Element | Syntax |
---|---|
Table | | Syntax | Description | | ———– | ———– | | Header | Title | | Paragraph | Text | Note that there must be a blank line after the table. |
Fenced code block | ```{ firstname: ‘dongtian’, lastname: ‘chen’ }``` Use ``` [language] to specify code block language, for example ``` js to specify javascript. See supported language here |
Footnote | Here’s a sentence with a footnote. [^1] [^1]: This is the footnote. |
Definition List | term : definition |
Strikethrough | ~~The world is flat.~~ |
Task List | - [x] Write the press release - [ ] Update the website - [ ] Contact the media |
Emoji | That is so funny! 😂 |
Highlight | I need to highlight these ==very important words==. |
Subscript | H~2~O |
Superscript | X^2^ |
FAQ
- Escaping
Use backslash to escape most special characters.
- Leading spaces
Markdown does not support leading spaces before each paragraph. Use (may have some problem with specific renderer like Hexo) or full-width space(a prettier solution) at the beginning.
- Custom style
Use html tags directly in markdown and style them with css.1
2
3
4
5
6
7> <div class="poetry">满堂花醉三千客,一剑霜寒十四州。</div>
<style>
.poetry {
text-align: center;
}
</style>
- Warning box
The easiest way is to use emojis:
1 | > ⚠ **If you are using mobile browser**: Be very careful here! |
- Change line in blockquote
1 | > Case 1 |
will produce:
Case 1
00:23
00:54
Case 2
00:21
00:51
or an easier one(leave one space at the beginning of the second line and so on):
1 | > line 1 |
will produce:
line 1
line 2
line 3
- Highlight delete/add line in code
Use diff
directive:
1 | ``` diff |
gives:
1 | - I like markup |
- Code block with filename
1 | ``` js, test.js |
gives:
1 | console.log('hello!') |
- List in list/nested list
Use 2 or 4 spaces:
1 | # Unordered list |