--- title: Basic icon: fluent:markdown-20-filled createTime: 2025/03/03 13:55:19 permalink: /en/guide/markdown/basic/ tags: - Guide - markdown --- ::: note This document is forked from [vuepress-theme-hope](https://theme-hope.vuejs.press/zh/cookbook/markdown/ ), following the [MIT](https://github.com/vuepress-theme-hope/vuepress-theme-hope/blob/main/LICENSE ) license. ::: Markdown is a markup language that can be written using a plain text editor. Through simple syntax, it allows regular text content to have formatting capabilities. The goal of Markdown is to achieve「readability and writability」. ## Overview The most emphasized aspect is its readability. A document written in Markdown should be directly publishable as plain text, and should not appear to be composed of tags or formatting instructions. Markdown syntax is influenced by several existing text-to-HTML formats, including [Setext][1], [atx][2], [Textile][3], [reStructuredText][4], [Grutatxt][5], and [EtText][6], with the primary inspiration coming from plain text email formatting. Thus, Markdown syntax consists entirely of punctuation marks, carefully selected to visually represent their meaning. For example, adding asterisks around text looks like \*emphasis\*. Markdown lists look like lists. If you've used email, blockquotes resemble quoted text. Markdown has various derivatives to extend its functionality (e.g., tables, footnotes, embedded HTML), features not originally available in basic Markdown. These enable conversion to formats like LaTeX, Docbook. Notable enhanced versions include Markdown Extra, MultiMarkdown, and Maruku. These derivatives are either tool-based (e.g., Pandoc) or website-based (e.g., GitHub, Wikipedia), maintaining basic syntax compatibility but modifying rendering effects. ## Usage Markdown's syntax has a primary purpose: to serve as a writing language for web content. Markdown focuses on making documents easier to read and write, thus its syntax only covers what plain text can represent. Markdown's syntax is simple, easy to learn, and more powerful than plain text, making it popular for blogging. WordPress, the world's most popular blogging platform, supports Markdown well. It's used for documentation, typically saved as `README.md` in software directories. Additionally, Markdown can quickly convert to presentation slides, Word documents, LaTeX papers, or even minimal viable prototypes with minimal code. In data science, Markdown has become essential for dynamic reproducible research. ### Inline HTML Any HTML tags not covered by Markdown can be directly written in the document. No special annotation is needed; simply include the tags. Block-level elements like `
| Foo |
` tags. For example: ```md - Bird - Magic ``` Would be converted to: ```html
Bird
Magic
` and `` tags.
Creating a code block in Markdown is simple: indent every line with 4 spaces or one tab. For example:
```md
This is a normal paragraph:
This is a code block.
```
Markdown converts this to:
```html
This is a normal paragraph:
This is a code block.
```
The indentation (4 spaces or one tab) is removed, so:
```md
Here is an example of AppleScript:
tell application "Foo"
beep
end tell
```
Becomes:
```html
Here is an example of AppleScript:
tell application "Foo"
beep
end tell
```
A code block continues until a line with no indentation (or the end of the file).
Within code blocks, `<`, `&`, and `>` are automatically converted to HTML entities, making it easy to insert HTML code examples. Just copy, paste, and indent, and Markdown handles the rest. For example:
````md
```html
```
````
Is converted to:
```html
<div class="footer">
© 2004 Foo Corporation
</div>
```
In code blocks, regular Markdown syntax isn't processed, so asterisks remain asterisks. This allows you to easily write about Markdown syntax.
If you want to include Markdown-formatted code libraries within a code block, you can nest them.
`````md
````md
```js
const a = 1
```
````
`````
Renders as
````md
```js
const a = 1
```
````
### Horizontal Rules
You can create a horizontal rule by placing three or more asterisks, hyphens, or underscores on a line. No other content should be on the line. You can also add spaces between the characters. Any of the following will create a horizontal rule:
```html
---(recommended) * * * *** ***** - - - ---------------------------------------
```
## Inline Elements
### Links
Markdown supports two types of link syntax: *inline* and *reference*.
In both cases, link text is marked with `[square brackets]`.
For an inline link, immediately after the square brackets, add parentheses with the URL. You can also include a title in quotes, like:
```html
This is [an example](http://example.com/ "Title") inline link. [This
link](http://example.net/ ) has no title attribute.
```
This produces:
```html
This is an example inline
link.
This link has no title attribute.
```
For linking to resources on the same host, you can use relative paths:
```md
See my [About](/about/) page for details.
```
Reference-style links use another set of square brackets after the link text, with an identifier for the link:
```md
This is [an example][id] reference-style link.
```
Then, define the link identifier anywhere in the document:
```md
[id]: http://example.com/ "Optional Title Here"
```
The link definition consists of:
- Square brackets with the link ID
- A colon
- One or more spaces or a tab
- The URL
- An optional title in single quotes, double quotes, or parentheses
These three link definitions are equivalent:
```md
[foo]: http://example.com/ "Optional Title Here"
[foo]: http://example.com/ "Optional Title Here"
[foo]: http://example.com/ "Optional Title Here"
```
**Note:** A known issue is that Markdown.pl 1.0.1 ignores single-quoted link titles.
URLs in link definitions can be enclosed in square brackets:
```md
[id]: http://example.com/ "Optional Title Here"
```
You can also place the title on a new line with indentation for better readability with long URLs:
```md
[id]: http://example.com/longish/path/to/resource/here "Optional Title Here"
```
Link identifiers are case-insensitive and can include letters, numbers, spaces, and punctuation. These two links are the same:
```md
[link text][a]
[link text][a]
```
The *default link ID* feature allows you to omit the link ID, making it the same as the link text. To use this, add empty square brackets after the link text. For example:
```md
[Google][]
```
Then define the link:
```md
[google]: http://google.com/
```
Since link text can contain spaces, the simplified ID can also include multiple words:
```md
Visit [Daring Fireball][] for more information.
```
Then define the link:
```md
[daring fireball]: http://daringfireball.net/
```
Link definitions can be placed anywhere in the document, either after the paragraph where the link appears or at the end like annotations.
Here's an example of reference-style links:
```md
I get 10 times more traffic from [Google][1] than from
[Yahoo][2] or [MSN][3].
[1]: http://google.com/ "Google"
[2]: http://search.yahoo.com/ "Yahoo Search"
[3]: http://search.msn.com/ "MSN Search"
```
Using link names instead:
```md
I get 10 times more traffic from [Google][] than from
[Yahoo][] or [MSN][].
[google]: http://google.com/ "Google"
[yahoo]: http://search.yahoo.com/ "Yahoo Search"
[msn]: http://search.msn.com/ "MSN Search"
```
Both methods produce the same HTML:
```html
I get 10 times more traffic from
Google than from
Yahoo
or MSN.
```
For comparison, here's the inline-style version of the same content:
```md
I get 10 times more traffic from [Google](http://google.com/ "Google")
than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or
[MSN](http://search.msn.com/ "MSN Search").
```
Reference-style links are more readable. The reference-style version has 81 characters, while the inline-style version has 176, and pure HTML would have 234. In HTML, tags outnumber text.
Using Markdown's reference-style links makes the document resemble the final browser output, allowing you to keep markup details separate from the main text for uninterrupted reading.
### Emphasis
Markdown uses asterisks (`*`) and underscores (`_`) to mark emphasis. Text surrounded by `*` or `_` is wrapped in ``, while text surrounded by double `*` or `_` is wrapped in ``, like:
```md
**double asterisks** (recommended)
**double underscores** (recommended)
_single asterisks_
_single underscores_
```
This converts to:
```html
single asterisks
single underscores
double asterisks
double underscores
```
You can choose your preferred style, as long as you use the same character to open and close.
Emphasis can be added in the middle of words:
```md
un*frigging*believable
```
However, if `*` or `_` has spaces on both sides, it will be treated as regular text.
To insert literal asterisks or underscores, use a backslash:
```md
\*this text is surrounded by literal asterisks\*
```
### Code
To mark inline code, wrap it in backticks (`` ` ``), like:
```md
Use the `printf()` function.
```
This produces:
```md
Use the printf() function.
```
To include a backtick within the code, use multiple backticks to open and close the inline code:
```md
``There is a literal backtick (`) here.``
```
This renders as:
```html
There is a literal backtick (`) here.
```
You can add a space at the start or end of the code span to include a backtick at the beginning:
```md
A single backtick in a code span: `` ` ``
A backtick-delimited string in a code span: `` `foo` ``
```
This results in:
```html
A single backtick in a code span: `
A backtick-delimited string in a code span: `foo`
```
Within code spans, `&` and brackets are converted to HTML entities, making it easier to insert HTML code. Markdown converts:
```md
Please don't use any `