Cú pháp markdown

November 11 2012 · 5 minute read · markdown

Markdown là ngôn ngữ đánh dấu đơn giản, tạo thuận tiện cho việc chuyển đổi từ văn bản thuần sang HTML. Đây là bản cú pháp markdown thần chưởng

Một tiêu đề của đoạn văn được bắt đầu bằng dấu thăng (#). Số lượng dấu thăng thể hiện cấp độ của tiêu đề và không nhiều hơn sáu.

# Tiêu đề 1
## Tiêu đề 2
### Tiêu đề 3 ###  (Dấu thăng # bên phải là tuỳ ý)

và khi tạo tiêu đề với ID như thế này:

## Tiêu đề {#id}

sẽ tạo được liên kết đến tiêu đề đó:

[Liên kết đến tiêu đề có ID](#id)

Ghi chú: kramdownmaruku hỗ trợ tạo bảng nội dung (table of content) dựa trên các tiêu đề khi biên dịch sang HTML bằng cách thêm vào đoạn mã sau vào đầu bài viết: {: .notice}

* Bảng nội dung
{:toc}

Đoạn văn (Paragraph):

Một đoạn văn bao gồm một dòng hoặc nhiều dòng.

Trong đoạn văn có thể có khoảng trắng hoặc tab. Các đoạn văn ngăn cách nhau bằng một dòng trắng.

Một đoạn văn bao gồm một dòng hoặc nhiều dòng.

Trong đoạn văn có thể có khoảng      trắng hoặc     tab. Các đoạn văn ngăn cách
nhau bằng một dòng trắng.

Đoạn văn có thể được xuống dòng bằng cách thêm hai khoảng trắng hoặc hai dấu gạch chéo ngược (\\) vào cuối dòng như trong bài thơ sau:

Quê hương là chùm kế ngọt\\
Cho con trèo hái mỗi ngày  
Quê hương là đường đi học\\
Con về rợp bóng cò bay.

Đoạn trích dẫn (Blockquote)

Đoạn trích dẫn được bắt đầu với kí tự trích dẫn phải (>) tại đầu mỗi dòng như khi trả lời email hay chỉ dòng đầu tiên và có thể được lồng vào nhau.

> đây là đoạn
trích dẫn.
>
> > được lồng vào nhau
thế này.

đây là đoạn trích dẫn.

được lồng vào nhau thế này.

Khối mã (Code block)

Các đoạn mã được trình bày bằng cách thêm bốn khoảng trắng tại đầu mỗi dòng mã (standard code block):

    Dòng mã 1
    Dòng mã 2
    Dòng mã 3

hoặc thêm các dấu ngã ~ (>=3) vào dòng trên và dòng dưới đoạn mã (fenced code block):

~~~
Dòng mã 1
Dòng mã 2
Dòng mã 3
~~~

Một đoạn mã với ngôn ngữ xác định:

~~~ ruby
def what?
    42
end
~~~

Ghi chú: để định dạng mã trong câu văn (inline code), ta dùng dấu ` bao quanh phần mã như thế này `inline code`

Đường kẻ ngang (Horizontal rule)

Dùng ba dấu sao, dấu gạch ngang, dấu gạch chân viết liền hoặc cách nhau khoảng trắng:

***
* * *
---
- - -
___
_ _ _






Danh sách (List)

* Danh sách với kí tự sao
- Hoặc dấu trừ
+ Và dấu cộng
1. Danh sách với số
2. Gồm số
3. Đi sau đó là dấu chấm và khoảng trắng
    1. Đây là
    2. danh sách con
69. Danh sách tự động đánh số tiếp theo
  1. Danh sách với số
  2. Gồm số
  3. Đi sau đó là dấu chấm và khoảng trắng
    1. Đây là
    2. danh sách con
  4. Danh sách tự động đánh số tiếp theo

Danh sách định nghĩa (Definition list)

Rượu
: nho
: vang
Rượu
nho
vang

Bảng (Table)

| Header | Header | Right  |
|:-------|:------:|-------:|
|  Cell  |  Cell  |   $10  |
|  Cell  |  Cell  |   $20  |
| ====== | ====== | =====: |
| Footer | Footer | Footer |
Header Header Right
Cell Cell $10
Cell Cell $20
====== ====== =====:
Footer Footer Footer

Nhấn mạnh chữ (Emphasis)

Đây là *chữ in nghiêng* và đây cũng _in nghiêng_

Đây là **chữ in đậm** và đây cũng __in đậm__

Đây là chữ in nghiêng và đây cũng in nghiêng

Đây là chữ in đậm và đây cũng in đậm

Một liên kết tự động được tạo đơn giản với cặp móc nhọn (<,>) bao quanh liên kết như thế này:

<http://google.com>

http://google.com

hoặc cầu kỳ hơn với liên kết nội tuyến:

Đây là trang [Google](http://google.com) và đây là trang [Google với tiêu
đề](http://google.com "Trang tìm kiếm Google")

Đây là trang Google và đây là trang Google với tiêu đề

Và đây là liên kết tham chiếu:

Truy cập [trang tìm kiếm][Google] và đặt [Google] làm trang chủ

[Google]: http://google.com "google"

Truy cập trang tìm kiếm và đặt Google làm trang chủ

Hình ảnh (Image)

Với hình ảnh cũng tương tự:

![hoa](/images/hoa-anh-dao.jpg 'hoa anh đào')

hoa

Lời chú cuối trang (Footnote)

Đây là một ghi chú[^1]

[^1]: và đây là diễn giải footnote

Đây là một ghi chú1

Chữ viết tắt (Abbreviation)

Đây là CVT

*[CVT]: Chữ Viết Tắt

Đây là CVT

*[CVT]: Chữ Viết Tắt

Phần tử HTML (HTML)

Các cặp tag HTML cũng được hỗ trợ như thế này

<div style="float: right">
Phần câu này trôi dạt sang bờ bên phải
</div>

Trong câu này, <span style="color: red">phần này được viết màu đỏ</span>, *phần
này màu xanh in nghiêng*{: style="color: blue"}
Phần câu này trôi dạt sang bờ bên phải

Trong câu này, phần này được viết màu đỏ, phần này màu xanh in nghiêng{: style=“color: blue”}


  1. và đây là diễn giải footnote [return]