Làm thế nào để tôi thêm viền cho một bảng trong Markdown?

2024-08-05

Phiên bản ngắn

Markdown không hỗ trợ viền bảng trực tiếp; hãy sử dụng HTML thay vào đó:

<table>
<tr>
<th>Tên</th>
<th>Tuổi</th>
<th>Địa điểm</th>
</tr>
<tr>
<td>John</td>
<td>30</td>
<td>Mỹ</td>
</tr>
<tr>
<td>Jane</td>
<td>25</td>
<td>Canada</td>
</tr>
</table>

Phiên bản dài

1. Hiểu về giới hạn của Markdown

Markdown tự bản thân không có hỗ trợ chính thức để thêm viền vào các bảng. Tuy nhiên, nó cung cấp một cách để tạo ra các bảng đơn giản bằng cách sử dụng ký tự ống và dấu gạch cho các cột và hàng.

2. Sử dụng HTML cho các bảng có viền

Nếu cần viền, bạn có thể sử dụng HTML tiêu chuẩn thay vì cú pháp Markdown. Đây là cách:

<table>
<tr>
<th>Tên</th>
<th>Tuổi</th>
<th>Địa điểm</th>
</tr>
<tr>
<td>John</td>
<td>30</td>
<td>Mỹ</td>
</tr>
<tr>
<td>Jane</td>
<td>25</td>
<td>Canada</td>
</tr>
</table>

Điều này sẽ hiển thị một bảng có viền, bất kể trình biên dịch Markdown.

3. Tạo kiểu viền bằng CSS

Nếu bạn nhúng Markdown trong một trang web, bạn có thể tạo kiểu cho viền bảng bằng cách sử dụng CSS. Sử dụng quy tắc CSS sau để thêm viền cho tất cả các bảng:

table,
th,
td {
    border: 1px solid black;
    border-collapse: collapse;
}

Thêm CSS này sẽ cải thiện khía cạnh hình ảnh của bảng Markdown khi được hiển thị trong môi trường web.