Log in with LINE
caption เป็นแท็กที่เกี่ยวกับการอธิบาย เช่น ตัวอย่างคำอธิบายตาราง ซึ่งปกติดแล้วแท็ก <caption> นี้ไว้ภายในแท็กของ <table> ซึ่งเราก็จะสามารถกำหนดตำแหน่งการแสดงให้ไปอยู่ตำแหน่งที่ต้องการได้ โดยการใช้คำสั่ง caption-side:ค่าที่ใช้สำหรับคำสั่งนี้ เช่น
caption-side: top; กำหนดให้อยู่บนของตาราง
caption-side: bottom; กำหนดให้อยู่ด้านล่างของตาราง
caption-side: left; กำหนดให้อยู่ด้านซ้ายของตาราง
caption-side: right; กำหนดให้อยู่ด้านขวาของตาราง
ตัวอย่างโค้ดที่เขียน
Code: Select all
<html>
<head>
<style>
caption {
caption-side: bottom; //กำหนดให้ คำอธิบาย อยู่ด้านล่างของตาราง
}
</style>
</head>
<body>
<table border="1">
<caption>ตารางที่ 1.1 Company</caption> //เรียกใช้แท็กของ Caption
<tr>
<th>บริษัท</th>
<th>จังหวัด</th>
</tr>
<tr>
<td>บริษัท ก </td>
<td>กรุงเทพมหานคร</td>
</tr>
<tr>
<td>บริษัท ข </td>
<td>ราชบุรี</td>
</tr>
<tr>
<td>บริษัท ค </td>
<td>สมุทปราการ</td>
</tr>
<tr>
<td>บริษัท ง </td>
<td>ลพบุรี</td>
</tr>
<tr>
<td>บริษัท จ </td>
<td>กรุงเทพมหานคร</td>
</tr>
</table>
</body>
</html>- 2015-03-10_17-43-36.jpg (28.56 KiB) Viewed 517 times
CSS การใส่สีให้เส้นขอบตาราง
CSS การสร้างตาราง