การจัดการรูปภาพในภาษา HTML กล่าวถึงการใส่รูปภาพพื้นหลังให้กับตารางเป็นการกำหนดแอตทริบิวต์ background ในแท็ก <table> และการแทรกรูปภาพใช้แท็ก <img src="/รูปภาพ"> ในตาราง
การใส่รูปภาพพื้นหลังตารางในภาษา HTML
สามารถใส่รูปภาพให้กับพื้นหลังของตารางได้ด้วยการใช้แอตทริบิวต์ background โดยการกำหนดอยู่ภายในแท็ก <table> ทั้งนี้ไม่นิยมใช้กับรูปภาพที่มีความละเอียดน้อยเพราะอาจทำให้รูปที่นำมาใช้งานนั้นแสดงผลแตกแยกควรใช้รูปภาพที่มีรายละเอียดลวดลายน้อยเพราะการกำหนดรูปภาพบนพื้นตารางนั้นจะมีการนำเสนอข้อมูลต่าง ๆ ในตารางด้วย ดังนั้นหากนำรูปภาพที่มีรายละเอียดลวดลายมากเกินไปมากำหนดเพิ่มอีกอาจทำให้ความชัดเจนของข้อมูลลดลงทำให้ไม่สวยงาม
รูปแบบการใช้งาน
<table background= “ชื่อไฟล์รูปภาพ”>
<tr><td>ข้อมูล1</td><td>ข้อมูล2</td></tr>
<tr><td>ข้อมูล1</td><td>ข้อมูล2</td></tr>
</table>
ตัวอย่าง
<table border=1 cellspacing=”0” cellpadding=”2” background=”images/bg.png”>
<caption align=top>ตารางเวรประจำวัน</caption>
<tr><th>จันทร์</th><td>ฉัตรชัย</td><td>ขนิษฐา</td>
<td>เพ็ญศิริ</td></tr>
<tr><th>อังคาร</th><td>ภานุพงษ์</td><td>จิราพร</td>
<td>ธนัณชญา</td></tr>
<tr><th>พุธ</th><td>จิตรภานุ</td><td>ปรีดาภรณ์</td>
<td>ฐาปนี</td></tr>
<tr><th>พฤหัสฯ</th><td>กษิดิศ</td><td>พัณณิตา</td>
<td>จารุพร</td></tr>
<tr><th>ศุกร์</th><td>ศุภวิชญ์</td><td>วรโชติ</td>
<td>ปรางค์ทอง</td></tr>
</table>
การแทรกรูปภาพในตารางภาษา HTML
สามารถนำรูปภาพมาแทรกในเซลล์ตารางได้ โดยการใช้แท็ก <img> ซึ่งเป็นแท็กเดี่ยวมีเฉพาะแท็กเปิด (open tag) ใช้คู่กับแอตทริบิวต์ในการกำหนดไฟล์รูปภาพ src แท็ก <img src= “ไฟล์รูปภาพ”> กำหนดระหว่างแท็ก <td>...</td>
รูปแบบการใช้งาน
<table>
<tr>
<td><img src= “ไฟล์รูปภาพ”></td>
<td><img src= “ไฟล์รูปภาพ”>ข้อความ</td>
</tr>
</table>
ตัวอย่าง
<table border= “1”>
<caption align= “top”>การแทรกรูปในตาราง
</caption>
<tr><td><img src= “images/cat2.jpg”></td>
<td><img src= “images/cat4.jpg”></td></tr>
<tr align= “center”><td>กัตโตะ</td><td>โคนี</td></tr>
<table>