Hướng dẫn Markdown trong Jupyter Notebook

Tiêu đề

Tiêu đề bắt đầu bằng ký hiệu '#', tức dấu thăng theo sau là dấu cách. Có sáu cấp tiêu đề, trong đó tiêu đề lớn nhất chỉ dùng một dấu thăng và tiêu đề nhỏ nhất dùng sáu dấu thăng.

# (Tiêu đề 1, title)

## (Tiêu đề 2, tiêu đề chính)

### (Tiêu đề 3, tiêu đề phụ)

#### (Tiêu đề 4)

##### (Tiêu đề 5)

###### (Tiêu đề 6)``

Ngoài ra, tiêu đề có thể bắt đầu bằng thẻ Markup, tức từ h1 đến h6 với các cú pháp sau.

<h1>Header 1,title<h1>
<h2>Header 2,major headings<h2>
<h3>Header 3,subheadings<h3>
<h4>Header 4<h4>
<h5>Header 5<h5>
<h6>Header 6<h6>

Cả hai cú pháp trên đều có thể hiển thị tiêu đề từ h1 đến h6 sau khi nhấp "Run" trên thanh công cụ.

Trích dẫn khối

Trích dẫn khối có thể chứa một đoạn văn bản lớn và thường được thụt lề. Có thể tạo bằng ký hiệu Markdown '>' hoặc với <blockquote>text for blockquote</blockquote>

• >This is good
• <blockquote>This is good</blockquote>

Cả hai cú pháp trên đều hiển thị văn bản ở dạng thụt lề sau khi nhấp "Run" trên thanh công cụ.

Phần mã

Phần mã là nơi chỉ định mã của các ngôn ngữ lập trình khác nhau và có thể hiển thị: mã nội dòng bắt đầu bằng dấu backtick ' `inline code goes here` ' bao quanh, còn khối mã bắt đầu bằng ba dấu backtick ' ``` block line code goes here ``` '. Ngoài ra, thẻ Markup cho phần mã là ' <code>code goes here<code> '.

Ví dụ mã nội dòng dưới đây:
`x =5`

Sau khi nhấp "Run", bạn sẽ thấy mã nội dòng được tô nổi bật.

Ví dụ phần mã như sau:

• Dùng Markdown
```Python

str = "This is block level code"

print(str)

```
• Dùng thẻ Markup
<code>Python

str = "This is a block level code"

print(str)

</code>

Khi dùng Markdown, bạn có thể nhận được tô màu cú pháp nếu tên ngôn ngữ lập trình được nêu ngay sau ba dấu '```', ví dụ dưới đây:

Khi dùng Markdown, bạn sẽ không có tô màu cú pháp, nhưng mã vẫn được làm nổi bật:

Ký hiệu toán học

Ký hiệu toán học trong Markdown được bao bởi ký hiệu đô la '\$ mathematical expression goes here \$', còn trong Markup bạn có thể xem liên kết này để biết thêm chi tiết: Mathematical Operators. Bạn có thể xem ví dụ sử dụng ký hiệu toán học bên dưới.

\$\sqrt{k}$

Ví dụ trên sẽ hiển thị biểu thức toán học ở dạng đậm.

Xuống dòng

Thẻ xuống dòng bắt đầu với thẻ <br> không có thẻ đóng; thẻ này sẽ ngắt dòng và phần nội dung còn lại bắt đầu ở dòng mới như ví dụ dưới đây.

The line breaks after using <br> br tags and it is awesome.

Sau khi nhấp "Run" trên thanh công cụ, bạn sẽ thấy xuống dòng sau khi dùng thẻ <br>. Phần văn bản còn lại bắt đầu ở dòng mới.

Chữ đậm và nghiêng

Bạn có thể dùng thẻ <b>, "**" tức dấu hoa thị kép hoặc "__" tức dấu gạch dưới kép để tạo chữ đậm với cú pháp sau.

• <b>This is bold text </b>

• ** This is bold text

• __ This is bold text

Tất cả các cú pháp trên đều hiển thị chữ đậm sau khi nhấp "Run" trên thanh công cụ.

Bạn có thể dùng thẻ <i>, ký hiệu '*' tức dấu hoa thị đơn hoặc '_' tức dấu gạch dưới đơn để tạo chữ nghiêng với cú pháp sau.

• <i>This is italic text </i>

• * This is italic text

• _ This is italic text

Tất cả các cú pháp trên đều hiển thị chữ nghiêng sau khi nhấp "Run" trên thanh công cụ.

Đường kẻ ngang

Bạn có thể tạo đường kẻ ngang bằng Markdown '---' ba dấu gạch ngang hoặc thẻ Markup <hr>

Cả hai cú pháp trên sẽ hiển thị đường kẻ ngang từ đầu này đến đầu kia sau khi nhấp "Run".

Danh sách có thứ tự

Danh sách có thứ tự là danh sách được đánh số, tạo bằng thẻ mở <ol> và thẻ đóng </ol> với các mục nằm giữa thẻ <li> và </li>. Thẻ 'ol' là viết tắt của ordered list (danh sách có thứ tự) và 'li' là list item (mục danh sách). Ví dụ dưới đây là danh sách có thứ tự cho danh sách thực phẩm.

<ol>
<li>Fish</li>
<li>Eggs</li>
<li>Cheese</li>
</ol>

Ngoài ra, bạn có thể liệt kê bằng '1. ' tức số thứ tự theo sau là dấu cách, như ví dụ dưới đây.

1. Fish
2. Eggs
3. Cheese

Cả hai cú pháp trên đều hiển thị danh sách đánh số sau khi nhấp "Run" trên thanh công cụ.

Danh sách không thứ tự

Danh sách không thứ tự là danh sách đầu dòng (bullet) được tạo bằng thẻ <ul> và kết thúc bằng thẻ </ul>, xem ví dụ dưới đây:

<ul>
<li>Fish</li>
<li>Eggs</li>
<li>Cheese</li>
</ul>

Ngoài ra, danh sách không thứ tự có thể bắt đầu bằng ký hiệu '-' theo sau là dấu cách, tạo ký hiệu hình tròn đen, hoặc bắt đầu bằng ký hiệu '*' theo sau là dấu cách, tạo ký hiệu hình vuông đen.

-   Fish
-   Eggs
-   Cheese

Ví dụ trên cho thấy danh sách đầu dòng dùng ký hiệu '-' theo sau là dấu cách với các mục, tạo biểu tượng hình tròn đen.

Cả hai cú pháp trên đều hiển thị cùng một kết quả, trong đó các mục trong danh sách xuất hiện với hình tròn đen, sau khi nhấp "Run" trên thanh công cụ.

Liên kết nội bộ và bên ngoài

Liên kết nội bộ trong Markdown bắt đầu bằng thẻ <a> với id duy nhất được định nghĩa bởi thuộc tính 'id' có thể liên kết trong notebook như ví dụ dưới đây:

<a id = "division_ID"text goes here></a>

Id được định nghĩa ở trên có thể liên kết đến một phần trong notebook bằng đoạn mã sau để biến liên kết thành có thể nhấp.

[Section title](#division_ID)

Ví dụ cho phần trên có thể thấy bên dưới, nơi id được định nghĩa được liên kết với phần tương ứng và liên kết có thể nhấp xuất hiện sau khi nhấp "Run" trên thanh công cụ.

Liên kết bên ngoài trong Markdown bắt đầu và kết thúc bằng thẻ <a>; <a> là thẻ anchor định nghĩa liên kết và có thuộc tính 'href' (hyper reference) chứa địa chỉ đích của liên kết hoặc URL; phần văn bản giữa các thẻ hiển thị và có thể nhấp để mở địa chỉ đích như dưới đây.

<a> href="https://www.google.com" >Link to Google</a>

Ngoài ra, cũng có thể bắt đầu với __[text link](URL for the site)__ trong đó dấu gạch dưới kép ở hai bên, văn bản liên kết nằm trong ngoặc vuông và URL của trang nằm trong ngoặc đơn theo sau là URL.

Link to Google

Cả hai cú pháp trên đều hiển thị cùng một kết quả bên dưới, nơi văn bản có gạch chân và có thể nhấp sẽ dẫn đến trang mới sau khi nhấp "Run" trên thanh công cụ.

Bảng

Bảng chứa thông tin theo hàng và cột, được tạo bởi sự kết hợp của '|' tức 'vertical pipe' để phân tách mỗi cột và '-' tức dấu gạch ngang để tạo phần tiêu đề; một dòng trống, tức kết hợp của các dấu gạch dọc và gạch ngang, để hiển thị định dạng bảng.

Bạn cũng có thể điều chỉnh ô bằng cách căn thô với các cột; notebook sẽ tự động thay đổi kích thước nội dung trong ô tương ứng.

|Name|Address|Salary| |-----|-------|------| |Hanna|Brisbane|4000| |Adam|Sydney|5000|

Ngoài ra, có thể dùng Markdown để tạo bảng, trong đó < table > dùng để định nghĩa một bảng với chiều rộng theo phần trăm. <tr> đặt hàng của bảng và cho nội dung in đậm, căn giữa cùng với tiêu đề bảng được mô tả bởi <th> ở phía trên của bảng, còn các mục khác trong bảng được đặt bằng <td> tức thẻ dữ liệu bảng.

<table style="width:20%">
<tr>
<th><Name></th>
<th><Address></th>
<th><Salary></th>
</tr>

<tr>
<td><Hanna></td>
<td><Brisbane></td>
<td><4000></td>
</tr>

<tr>
<td><Adam></td>
<td><Sydney></td>
<td><5000></td>
</tr>
</table>

Cả hai cú pháp trên đều hiển thị cùng một kết quả sau khi nhấp "Run" trên thanh công cụ.

Hình ảnh

Bạn có thể chèn hình ảnh từ thanh công cụ bằng cách chọn 'Insert Image' trong menu Edit và duyệt đến hình ảnh cần thiết như dưới đây.

Hình ảnh có thể dùng thẻ Markdown <img> với thuộc tính nguồn, tức src, chứa liên kết đến hình cùng các thuộc tính tùy chọn như width và height; ví dụ như dưới đây.

<img> <src="https://i.imgur.com/WWrydEh.png" width ="500" height=500 >

Cả hai cách trên đều hiển thị cùng một hình ảnh sau khi nhấp "Run" trên thanh công cụ.

Kết luận

Trong hướng dẫn này, bạn đã tìm hiểu về các thẻ Markup khác nhau do ngôn ngữ Markup định nghĩa, cùng với cú pháp liên quan đến các ô Markdown dành riêng cho Jupyter Notebook, được dùng song song với mã để mô tả nội dung hiệu quả hơn.

Nếu bạn muốn tìm hiểu thêm về Markdown, hãy xem Markdown Guide.