ข้อมูลอ้างอิงHTML

HTML โดยตัวอักษร HTML ตามหมวดหมู่ รองรับ HTML Browser แอตทริบิวต์ HTML HTML Global Attributes เหตุการณ์ HTML HTML สี HTML Canvas HTML เสียง/วิดีโอ ชุดอักขระ HTML HTML Doctypes การเข้ารหัส URL HTML รหัสภาษา HTML รหัสประเทศ HTML ข้อความ HTTP วิธี HTTP ตัวแปลง PX เป็น EM แป้นพิมพ์ลัด


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;
}