Online Tools Toolshu.com Log In Sign Up

The Complete Markdown Cheat Sheet: From Basic Syntax to Advanced Tricks

Original Author:bhnw Released on 2026-04-08 09:54 12 views Star (0)

Why Bother Learning Markdown

Tired of clicking through rich-text toolbars every time you write technical documentation, a README, or a blog post? Markdown lets you write clearly structured documents using nothing but your keyboard, and the result converts directly to HTML — ready to use on GitHub, Notion, Dev.to, and countless other platforms out of the box.

Learn it once. Use it everywhere.


Basic Syntax

Headings

# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6

There must be a space between the # and the heading text — some parsers will not recognize it otherwise.


Paragraphs and Line Breaks

Pressing Enter once in Markdown does not create a line break — this is the most common beginner confusion.

This is the first line.
This is the second line. (Same paragraph as above)

This is a new paragraph. (A blank line creates a new paragraph)

Two ways to force a line break:

  • Add two spaces at the end of a line before pressing Enter
  • Add a \ at the end of the line (supported on some platforms)

Emphasis

*italic* or _italic_
**bold** or __bold__
***bold italic*** or ___bold italic___
~~strikethrough~~

Result: italic, bold, bold italic, strikethrough


Lists

Unordered lists (-, *, or + all work):

- Apple
- Banana
  - Plantain (nested — indent 2 spaces)
  - Mini banana
- Orange

Ordered lists:

1. Step one
2. Step two
3. Step three

The actual numbers don't affect the rendered order — writing 1. for every item still auto-numbers correctly. That said, using proper numbers makes the source easier to read.


Links

[Link text](https://toolshu.com)
[Link with title](https://toolshu.com "Shown on hover")

<!-- Reference-style links — useful when the same URL appears multiple times -->
[toolshu][1]

[1]: https://toolshu.com

Images

![Alt text](https://example.com/image.png)
![Alt text](https://example.com/image.png "Image title")

Standard Markdown does not support specifying image dimensions. Use HTML when you need size control:

<img src="https://example.com/image.png" width="300" alt="Description">

Blockquotes

> This is a blockquote.
> It can span multiple lines.
>
> A blank line keeps you inside the blockquote.

> Blockquotes can be nested.
>> Second level
>>> Third level

Code

Inline code — wrap with backticks:

Run `npm install` to install dependencies.

Code blocks — wrap with three backticks and add a language name for syntax highlighting:

```javascript
const greeting = "Hello, World!";
console.log(greeting);
```

Common language identifiers: javascript, python, java, bash, sql, json, css, html, go, rust


Horizontal Rules

---
***
___

All three produce the same result. --- is the most readable in source.


Advanced Syntax (GFM)

The following features belong to GitHub Flavored Markdown (GFM). They are supported on GitHub, GitLab, and most major platforms, but are not part of the original Markdown specification.

Tables

| Name     | Type   | Description     |
|----------|--------|-----------------|
| id       | int    | Unique user ID  |
| username | string | Username        |
| email    | string | Email address   |

Alignment control:

| Left-aligned | Center-aligned | Right-aligned |
|:-------------|:--------------:|--------------:|
| content      | content        | content       |

Column widths don't need to match in the source — the parser handles it. Aligning them anyway makes the raw source easier to read.


Task Lists

- [x] Completed task
- [ ] Incomplete task
- [x] Another completed item

GitHub, Notion, and similar platforms render these as interactive checkboxes.


Footnotes

This point needs a bit more explanation.[^1]

[^1]: This is the footnote content, rendered at the bottom of the document.

Autolinks

Plain URLs become links automatically: https://toolshu.com
Or use angle brackets: <https://toolshu.com>

Escaping Backticks Inside Code Blocks

To include three backticks inside a code block, wrap the outer block with four backticks:

````
```these three backticks will not be parsed```
````

Common Pitfalls

1. Code blocks after a list need a blank line

- List item

    Code block (4-space indent, or fenced after a blank line)

2. Headings need a blank line before them

Previous paragraph text.

## Heading (blank line before it ensures correct parsing)

3. Bold cannot span lines within the same paragraph

**This is bold
but the line break may break it**   ← some parsers will not render this correctly

4. Line breaks inside table cells

Use the <br> tag for line breaks within a table cell:

| Column 1              | Column 2 |
|-----------------------|----------|
| Line one<br>Line two  | Content  |

Platform Differences at a Glance

Platform GFM Tables Task Lists Footnotes Math
GitHub ✅ ($$)
Notion
Dev.to
VS Code Preview Requires plugin

If you want to see how your Markdown renders as HTML — or convert an existing HTML snippet back into Markdown for editing — the Markdown/HTML Converter on toolshu.com gives you a live preview instantly, no local setup required.

发现周边 发现周边
Comment area

Loading...