HTML <caption>แท็ก
ตัวอย่าง
โต๊ะพร้อมคำบรรยาย:
<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
ตัวอย่าง "ลองใช้เอง" เพิ่มเติมด้านล่าง
ความหมายและการใช้งาน
แท็ ก<caption>
กำหนดคำอธิบายตาราง
<caption>
ต้องใส่
แท็กต่อ จากแท็ก<table> ทันที
เคล็ดลับ:ตามค่าเริ่มต้น คำอธิบายตารางจะจัดกึ่งกลางเหนือตาราง อย่างไรก็ตาม คุณสมบัติ CSS text-alignและcaption-side สามารถใช้เพื่อจัดตำแหน่งและวางคำบรรยายได้
รองรับเบราว์เซอร์
Element | |||||
---|---|---|---|---|---|
<caption> | Yes | Yes | Yes | Yes | Yes |
คุณสมบัติสากล
แท็ ก<caption>
ยังสนับสนุน Global Attributes ในHTML
คุณสมบัติของเหตุการณ์
แท็ ก<caption>
ยังสนับสนุนแอตทริบิวต์เหตุการณ์ใน HTML
ตัวอย่างเพิ่มเติม
ตัวอย่าง
คำอธิบายตารางตำแหน่ง (ด้วย CSS):
<table>
<caption style="text-align:right">My savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<br>
<table>
<caption
style="caption-side:bottom">My savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
หน้าที่เกี่ยวข้อง
การอ้างอิง HTML DOM: Caption Object
การตั้งค่า CSS เริ่มต้น
เบราว์เซอร์ส่วนใหญ่จะแสดง<caption>
องค์ประกอบด้วยค่าเริ่มต้นดังต่อไปนี้:
ตัวอย่าง
caption {
display: table-caption;
text-align: center;
}