Cú pháp mở rộng Markdown: Hướng dẫn đầy đủ với ví dụ

Cú pháp cơ bản của Markdown đáp ứng hầu hết nhu cầu viết hàng ngày, nhưng đôi khi bạn cần nhiều hơn. Cú pháp mở rộng bổ sung các tính năng mạnh mẽ như bảng, chú thích, danh sách công việc và nhiều hơn nữa — biến Markdown từ một công cụ định dạng đơn giản thành một môi trường viết đầy đủ tính năng.

Không phải tất cả trình xử lý Markdown đều hỗ trợ mọi phần tử cú pháp mở rộng. Trước khi sử dụng, hãy kiểm tra xem công cụ hoặc nền tảng của bạn có hỗ trợ tính năng cụ thể mà bạn cần hay không. Tin tốt là: hầu hết các nền tảng hiện đại — GitHub, GitLab, VS Code và các trình tạo trang tĩnh phổ biến — đều hỗ trợ phần lớn các phần mở rộng này.

Nếu bạn chưa quen với các kiến thức cơ bản, hãy bắt đầu với hướng dẫn cú pháp cơ bản Markdown của chúng tôi trước.

Bảng

Markdown Tables

Bảng cho phép bạn tổ chức dữ liệu thành hàng và cột trực tiếp trong Markdown. Sử dụng dấu gạch đứng (|) để phân tách cột và dấu gạch ngang (-) để tạo hàng tiêu đề.

| Feature       | Basic Syntax | Extended Syntax |
| ------------- | ------------ | --------------- |
| Tables        | No           | Yes             |
| Footnotes     | No           | Yes             |
| Task Lists    | No           | Yes             |

Kết quả hiển thị:

Feature	Basic Syntax	Extended Syntax
Tables	No	Yes
Footnotes	No	Yes
Task Lists	No	Yes

Căn chỉnh cột

Kiểm soát căn chỉnh văn bản bằng cách thêm dấu hai chấm vào hàng phân cách tiêu đề:

| Left Aligned | Center Aligned | Right Aligned |
| :----------- | :------------: | ------------: |
| Text         |     Text       |          Text |
| More         |     More       |          More |

:--- căn trái (mặc định)
:---: căn giữa
---: căn phải

Mẹo sử dụng bảng

Bạn không cần căn chỉnh hoàn hảo các dấu gạch đứng trong mã nguồn — chỉ để trông gọn gàng hơn
Bảng hỗ trợ định dạng nội tuyến như đậm, nghiêng, mã và liên kết
Bảng không hỗ trợ tiêu đề, trích dẫn, danh sách hoặc hình ảnh bên trong ô
Với dữ liệu phức tạp, hãy cân nhắc sử dụng bảng HTML

Khối mã có rào chắn

Markdown Fenced Code Blocks

Cú pháp cơ bản hỗ trợ khối mã thụt lề, nhưng khối mã có rào chắn thực tế hơn nhiều. Bao bọc mã của bạn bằng ba dấu backtick (```) hoặc ba dấu ngã (~~~) và chỉ định ngôn ngữ để tô sáng cú pháp.

```python
def fibonacci(n):
    if n <= 1:
        return n
    return fibonacci(n - 1) + fibonacci(n - 2)

print(fibonacci(10))
```

Kết quả hiển thị với tô sáng cú pháp đầy đủ:

def fibonacci(n):
    if n <= 1:
        return n
    return fibonacci(n - 1) + fibonacci(n - 2)

print(fibonacci(10))

Ngôn ngữ được hỗ trợ

Hầu hết trình kết xuất hỗ trợ hàng chục mã định danh ngôn ngữ. Đây là những ngôn ngữ phổ biến nhất:

Language        Identifier
--------------  ----------------
JavaScript      javascript / js
Python          python / py
TypeScript      typescript / ts
HTML            html
CSS             css
JSON            json
Bash            bash / sh
SQL             sql
Markdown        markdown / md

Thực hành tốt nhất cho khối mã

Luôn chỉ định ngôn ngữ — điều này kích hoạt tô sáng cú pháp và cải thiện khả năng đọc
Sử dụng text hoặc plaintext khi không có ngôn ngữ phù hợp
Khối có rào chắn được ưu tiên hơn khối thụt lề vì hỗ trợ tô sáng và không yêu cầu thụt lề từng dòng

Chú thích

Markdown Footnotes

Chú thích cho phép bạn thêm ghi chú và tham chiếu mà không làm rối văn bản chính. Nội dung chú thích xuất hiện ở cuối trang.

Markdown was created by John Gruber in 2004.[^1] It has since become
the standard for technical writing.[^2]

[^1]: John Gruber's original Markdown project is documented on
    [Daring Fireball](https://daringfireball.net/projects/markdown/).
[^2]: Markdown is used by GitHub, Stack Overflow, Reddit, and
    countless other platforms.

Các số tham chiếu được hiển thị dưới dạng liên kết chỉ số trên trong văn bản, với các ghi chú đầy đủ được liệt kê ở cuối tài liệu.

Quy tắc cú pháp chú thích

Tham chiếu chú thích sử dụng [^identifier] — mã định danh có thể là số hoặc từ (không có khoảng trắng)
Định nghĩa chú thích bắt đầu bằng [^identifier]: theo sau là nội dung
Chú thích nhiều đoạn yêu cầu thụt lề (bốn khoảng trắng hoặc một tab) cho các đoạn tiếp theo
Định nghĩa chú thích có thể đặt ở bất kỳ đâu trong tài liệu — chúng luôn được hiển thị ở cuối

Here's a footnote with multiple paragraphs.[^note]

[^note]: This is the first paragraph of the footnote.

    This is the second paragraph, indented with four spaces.

    You can even include code: `console.log("hello")`

ID tiêu đề

ID tiêu đề tùy chỉnh cho phép bạn tạo liên kết neo chính xác đến các phần cụ thể trong tài liệu. Thêm ID trong dấu ngoặc nhọn sau văn bản tiêu đề.

### My Custom Section {#custom-section}

Điều này tạo ra:

<h3 id="custom-section">My Custom Section</h3>

Liên kết đến ID tiêu đề

Khi tiêu đề có ID, bạn có thể liên kết trực tiếp đến nó:

Jump to [My Custom Section](#custom-section).

Điều này đặc biệt hữu ích khi tạo mục lục thủ công ở đầu tài liệu dài:

## Contents

- [Introduction](#introduction)
- [Getting Started](#getting-started)
- [Advanced Usage](#advanced-usage)
- [FAQ](#faq)

Lưu ý về tương thích

Nhiều trình xử lý (bao gồm GitHub) tự động tạo ID tiêu đề từ văn bản tiêu đề ngay cả khi không có cú pháp {#id}. Tuy nhiên, việc đặt ID rõ ràng cho bạn quyền kiểm soát hoàn toàn và đảm bảo hành vi nhất quán trên các nền tảng.

Danh sách định nghĩa

Danh sách định nghĩa hoàn hảo cho bảng thuật ngữ, FAQ và bất kỳ nội dung nào cần ghép thuật ngữ với giải thích.

Markdown
: A lightweight markup language for creating formatted text
  using a plain-text editor.

HTML
: The standard markup language for documents designed to be
  displayed in a web browser.

YAML
: A human-readable data serialization language commonly used
  for configuration files.

Điều này tạo ra HTML sau:

<dl>
  <dt>Markdown</dt>
  <dd>A lightweight markup language for creating formatted text
      using a plain-text editor.</dd>
  <dt>HTML</dt>
  <dd>The standard markup language for documents designed to be
      displayed in a web browser.</dd>
</dl>

Nhiều định nghĩa

Một thuật ngữ có thể có nhiều hơn một định nghĩa:

Markdown
: A lightweight markup language.
: A tool used by developers and writers worldwide.

Lưu ý về tương thích

Danh sách định nghĩa không được hỗ trợ bởi tất cả trình xử lý. GitHub Flavored Markdown không hỗ trợ chúng, nhưng nhiều trình tạo trang tĩnh và công cụ tài liệu có hỗ trợ.

Gạch ngang

Gạch ngang hiển thị văn bản với một đường ngang xuyên qua, cho biết nội dung đã bị xóa hoặc lỗi thời. Bao bọc văn bản bằng dấu ngã kép (~~).

The project deadline is ~~Friday~~ Monday.
~~Old information~~ has been replaced with updated content.

Kết quả hiển thị:

The project deadline is ~~Friday~~ Monday.

Đầu ra HTML:

<p>The project deadline is <del>Friday</del> Monday.</p>

Gạch ngang được hỗ trợ rộng rãi — nó là một phần của GitHub Flavored Markdown (GFM) và hoạt động trên hầu hết các nền tảng hiện đại.

Danh sách công việc

Markdown Task Lists

Danh sách công việc (còn gọi là hộp kiểm hoặc danh sách việc cần làm) tạo danh sách kiểm tra tương tác. Sử dụng - [ ] cho mục chưa hoàn thành và - [x] cho mục đã hoàn thành.

- [x] Research extended syntax features
- [x] Write first draft
- [x] Add code examples for each section
- [ ] Create cover image
- [ ] Proofread and edit
- [ ] Publish the article

Kết quả hiển thị:

Trường hợp sử dụng danh sách công việc

Danh sách công việc đặc biệt phổ biến trong:

Issue và pull request trên GitHub — theo dõi tiến độ các mục công việc
Tài liệu dự án — phác thảo các bước trong quy trình
Ghi chú cuộc họp — ghi lại các mục hành động cùng trạng thái

Trên các nền tảng như GitHub, các hộp kiểm này có tính tương tác — bạn có thể nhấp để chuyển đổi trực tiếp trong chế độ xem đã kết xuất.

Emoji

Có hai cách để thêm emoji vào tài liệu Markdown của bạn.

Sao chép và dán

Cách đơn giản nhất — chỉ cần sao chép emoji từ bất kỳ nguồn nào và dán trực tiếp vào văn bản:

That's a great idea! 🎉 Let's ship it! 🚀

Điều này hoạt động ở mọi nơi vì emoji là ký tự Unicode tiêu chuẩn.

Mã ngắn

Một số nền tảng hỗ trợ mã ngắn emoji — từ khóa được bao trong dấu hai chấm:

:smile: :rocket: :thumbsup: :warning: :heavy_check_mark:

Các mã ngắn phổ biến bao gồm:

Shortcode              Emoji
---------------------  -----
:smile:                😄
:rocket:               🚀
:thumbsup:             👍
:warning:              ⚠️
:heavy_check_mark:     ✔️
:x:                    ❌
:fire:                 🔥
:star:                 ⭐

Lưu ý về tương thích

Mã ngắn emoji khác nhau giữa các nền tảng. GitHub, Slack và Discord mỗi nền tảng hỗ trợ bộ mã khác nhau. Emoji sao chép và dán hoạt động phổ quát và là lựa chọn an toàn hơn cho tài liệu đa nền tảng.

Tô sáng

Tô sáng thu hút sự chú ý vào các từ hoặc cụm từ chính bằng cách cung cấp nền màu. Bao bọc văn bản bằng dấu bằng kép (==).

This is ==critically important== information.

Điều này tạo ra:

<p>This is <mark>critically important</mark> information.</p>

Phương án thay thế HTML

Nếu trình xử lý Markdown của bạn không hỗ trợ cú pháp ==, hãy sử dụng trực tiếp thẻ HTML <mark>:

This is <mark>critically important</mark> information.

Cả hai cách đều tạo ra kết quả giống nhau — văn bản được tô sáng nổi bật so với nội dung xung quanh.

Lưu ý về tương thích

Cú pháp ==highlight== không được hỗ trợ rộng rãi. Nó hoạt động trong một số trình xử lý nhưng không có trong GitHub Flavored Markdown. Nếu tương thích quan trọng, hãy sử dụng thẻ HTML <mark>.

Chỉ số dưới và chỉ số trên

Các phần tử này rất cần thiết cho ký hiệu khoa học, biểu thức toán học và công thức hóa học.

Chỉ số dưới

Sử dụng dấu ngã đơn (~) để bao bọc văn bản chỉ số dưới:

The chemical formula for water is H~2~O.
Carbon dioxide is CO~2~.

Kết quả hiển thị: H₂O và CO₂.

Tương đương HTML:

<p>The chemical formula for water is H<sub>2</sub>O.</p>

Chỉ số trên

Sử dụng dấu mũ (^) để bao bọc văn bản chỉ số trên:

The equation is E = mc^2^.
This is the 3^rd^ edition.

Kết quả hiển thị: E = mc² và phiên bản thứ 3^rd.

Tương đương HTML:

<p>The equation is E = mc<sup>2</sup>.</p>

Phương án thay thế HTML

Nếu trình xử lý của bạn không hỗ trợ cú pháp ~ và ^, hãy sử dụng trực tiếp thẻ HTML:

H<sub>2</sub>O is water.
E = mc<sup>2</sup> is Einstein's famous equation.

Cách tiếp cận HTML này hoạt động trong hầu hết mọi trình kết xuất Markdown.

Liên kết URL tự động

Hầu hết trình xử lý Markdown tự động chuyển đổi URL thô thành liên kết có thể nhấp mà không cần cú pháp đặc biệt:

Visit https://example.com for more information.

Điều này hiển thị dưới dạng liên kết có thể nhấp ngay cả khi không sử dụng cú pháp [text](url).

Tắt liên kết tự động

Đôi khi bạn muốn hiển thị URL dưới dạng văn bản thuần mà không làm cho nó có thể nhấp. Bao bọc nó trong dấu backtick để hiển thị dưới dạng mã nội tuyến:

`https://example.com`

Điều này hiển thị URL dưới dạng mã thay vì liên kết có thể nhấp — hữu ích cho tài liệu khi bạn đang giải thích mẫu URL thay vì liên kết đến chúng.

Khi nào sử dụng liên kết rõ ràng

Mặc dù liên kết tự động tiện lợi, cú pháp liên kết rõ ràng cung cấp nhiều quyền kiểm soát hơn:

<!-- Automatic: shows raw URL -->
https://example.com

<!-- Explicit: shows custom text -->
[Visit our website](https://example.com)

Sử dụng liên kết rõ ràng khi bạn muốn văn bản neo mô tả — tốt hơn cho khả năng đọc và SEO.

Tham chiếu nhanh

Markdown Extended Syntax Quick Reference

Đây là tất cả các phần tử cú pháp mở rộng trong một cái nhìn:

Element              Syntax                     Support
-------------------  -------------------------  --------
Table                | Col | Col |              Wide
Fenced Code Block    ``` code ```               Wide
Footnote             [^1] / [^1]: text          Moderate
Heading ID           ### Heading {#id}          Moderate
Definition List      Term / : Definition        Limited
Strikethrough        ~~text~~                   Wide
Task List            - [x] / - [ ]             Wide
Emoji (shortcode)    :emoji_name:               Varies
Highlight            ==text==                   Limited
Subscript            H~2~O                      Limited
Superscript          X^2^                       Limited
Auto URL Link        https://...                Wide

Bắt đầu sử dụng cú pháp mở rộng

Bây giờ bạn đã biết tất cả các phần tử cú pháp mở rộng chính. Đây là cách đưa chúng vào thực tế:

Kiểm tra nền tảng của bạn: Xác minh những tính năng nào trình xử lý Markdown của bạn hỗ trợ. GitHub, VS Code và hầu hết trình tạo trang tĩnh xử lý tốt các phần tử được hỗ trợ rộng rãi.
Sử dụng phương án HTML thay thế: Đối với các tính năng có hỗ trợ hạn chế (tô sáng, chỉ số dưới, chỉ số trên), các thẻ HTML thay thế hoạt động gần như ở mọi nơi.
Thực hành với nội dung thực: Thử thêm bảng vào README tiếp theo, chú thích vào bài blog tiếp theo hoặc danh sách công việc vào kế hoạch dự án tiếp theo.
Chuyển đổi tự tin: Khi tài liệu của bạn sẵn sàng chia sẻ, chuyển đổi Markdown sang PDF cho đầu ra sẵn sàng in với hỗ trợ toán LaTeX và bảng, xuất sang HTML cho xuất bản web, hoặc tạo tài liệu Word để đánh giá với các bên liên quan — tất cả các phần tử cú pháp mở rộng đều được bao gồm.

Giữa cú pháp cơ bản và các tính năng mở rộng này, bạn đã có bộ công cụ Markdown hoàn chỉnh. Nếu bạn hoàn toàn mới với Markdown, hãy bắt đầu với Markdown là gì để nắm bắt các điều cơ bản. Dù bạn đang viết gì — tài liệu, bài blog, thông số kỹ thuật hay kế hoạch dự án — Markdown đều đáp ứng được.