ตาราง
ตารางง่าย ๆ
เราสามารถใส่ตารางแบบง่าย ๆ ได้ด้วยการใช้เครื่องหมาย | และการเว้นวรรค ดังตัวอย่างต่อไปนี้:
| หัวข้อ 1 | หัวข้อ 2 | หัวข้อ 3 |
|-----------|-----------|-----------|
| ข้อมูล 1 | ข้อมูล 2 | ข้อมูล 3 |
| ข้อมูล 4 | ข้อมูล 5 | ข้อมูล 6 |
จะได้ตารางลักษณะนี้:
| หัวข้อ 1 | หัวข้อ 2 | หัวข้อ 3 |
|---|---|---|
| ข้อมูล 1 | ข้อมูล 2 | ข้อมูล 3 |
| ข้อมูล 4 | ข้อมูล 5 | ข้อมูล 6 |
ตารางที่ซับซ้อน
กรณีที่ตารางมีความซับซ้อนมากขึ้น เช่น
- ต้องการ merge cell ในตาราง
- ต้องการใส่ bullet points ในตาราง
จำเป็นต้องใช้ syntax ของ HTML แทน
tip
ถ้ายังไม่คุ้นเคย สามารถใช้ HTML Tables Generator แล้ว copy code มาวางได้
ตัวอย่างตารางที่ซับซ้อน:
<table>
<thead>
<tr>
<th rowspan="2">หัวข้อหลัก</th>
<th colspan="2">แบบ A</th>
<th colspan="2">แบบ B</th>
</tr>
<tr>
<th>เล็ก</th>
<th>ใหญ่</th>
<th>เล็ก</th>
<th>ใหญ่</th>
</tr>
</thead>
<tbody>
<tr>
<td>ข้อมูล 1</td>
<td>ข้อมูล 2</td>
<td>ข้อมูล 3</td>
<td>
* หัวข้อ**สำคัญ** <!-- ถ้าจะใส่ markdown code ให้เว้นหนึ่งบรรทัดก่อน -->
* หัวข้อ[ทำ link ได้ด้วย](https://www.google.com)
</td> <!-- บรรทัดต่อจาก markdown ต้องติดด้านหน้า -->
<td>ข้อมูล 5</td>
</tr>
</tbody>
</table>
จะได้ตารางลักษณะนี้:
| หัวข้อหลัก | แบบ A | แบบ B | ||
|---|---|---|---|---|
| เล็ก | ใหญ่ | เล็ก | ใหญ่ | |
| ข้อมูล 1 | ข้อมูล 2 | ข้อมูล 3 |
| ข้อมูล 5 |