Markdown Syntax Guide

This article introduces commonly used Markdown syntax.

Headings

Use # to create headings, the number indicates the level.

Text Styles

• Bold text
• Italic text
• Strikethrough

Links and Images

Images in their own paragraphs are centered; images within text stay inline. Leave blank lines around a standalone image: a line break alone does not create a new paragraph.

This is a link

This is site icon:

Code

Inline code: const x = 1;

Code block:

def hello_world():
    print("Hello, World!")

netsh advfirewall firewall add rule name="GameStream UDP" dir=in protocol=udp localport=5353,47998-48010 action=allow
netsh advfirewall firewall add rule name="GameStream TCP" dir=in protocol=tcp localport=47984,47989,48010 action=allow

Lists

Unordered list:

• Item 1
• Item 2
• Item 3

Ordered list:

1. First step
2. Second step
3. Third step

Blockquote

This is a quoted text. It can span multiple lines.

Table

Native HTML

HTML can complement Markdown when writing articles. Each example below includes its source and rendered result. Mori enables raw HTML with markup.goldmark.renderer.unsafe = true; only include HTML from sources you trust. To use Markdown inside containers such as details, separate HTML tags from Markdown content with blank lines and keep Markdown content unindented, since four leading spaces create a code block. This technique does not apply to raw HTML blocks such as pre, script, or style.

Collapsible Content

Use details and summary for spoilers, answers, or supplementary notes. The summary works with both mouse and keyboard. Add the open attribute to expand the content initially.

<details>

<summary>Show the answer</summary>

The answer is **42**.

- Keep supplementary details here.
- Use Markdown such as _italics_ and `inline code`.

</details>

Highlights and Insertions

Use mark to highlight passages with the theme’s accent text color, without a background. Bold text (**text**) only changes font weight, not text color. Use ins for added content.

Remember to <mark>back up your files</mark> first.

New plan: <ins>release the update on Saturday</ins>.

Remember to back up your files first.

New plan: release the update on Saturday.

Keyboard Input and Abbreviations

Use kbd for keys and abbr with a title for an abbreviation’s full form. Keep important explanations in the text as well: title tooltips are not reliably accessible on touchscreens or with keyboards.

Press <kbd>Ctrl</kbd> + <kbd>S</kbd> to save.

<abbr title="HyperText Markup Language">HTML</abbr> means HyperText Markup Language.

Press Ctrl + S to save.

HTML means HyperText Markup Language.

Superscripts and Subscripts

Use sup and sub for simple formulas, units, and chemical notation.

Water: H<sub>2</sub>O. Area: 10 m<sup>2</sup>.

Water: H₂O. Area: 10 m².

Definition Lists

Use dl, dt, and dd for glossaries or explanations of terms.

<dl>
  <dt>Markdown</dt>
  <dd>A lightweight markup language for writing content.</dd>
  <dt>HTML</dt>
  <dd>A markup language that gives content structure and meaning.</dd>
</dl>

Markdown

A lightweight markup language for writing content.

HTML

A markup language that gives content structure and meaning.

Figures and Captions

Use figure and figcaption to associate an illustration with its caption. Provide meaningful alt text for images. Raw HTML images bypass Markdown image processing, so use a valid URL and add loading="lazy" when appropriate.

<figure>
  <img
    src="/favicon.ico"
    alt="Mori site icon"
    width="64"
    height="64"
    loading="lazy"
  />
  <figcaption>The Mori site icon.</figcaption>
</figure>