7.3 การวางรูปภาพและข้อความในตาราง

6.3 การใส่ข้อความและรูปภาพในตาราง

ในการใส่ข้อความในตารางสามารถทำได้โดยพิมพ์ข้อความที่ต้องการลงในส่วนของแถวหรือคอลัมน์ ที่ต้องการ

ส่วนการใส่รูปภาพในตารางนั้น ทำได้โดยการนำเอา Tag <img src="file รูปภาพ"> วางในส่วนของตาราง โดยสามารถกำหนดคุณสมบัติต่าง ๆ เกี่ยวกับการวางรูปภาพได้

ทดสอบการใส่ข้อความและรูปภาพในตาราง

<html> <head> <title>โฮมเพจของข้าพเจ้า:การสร้างตาราง</title> </head> <body bgcolor=#66FFCC> <p align="center">สถานที่สำคัญในมหาวิทยาลัยเกษตรศาสตร์</p> <table border="1" width="100%"> <tr> <td><center><img border="0" src="ku1.gif" width="241" height="163"></center></td> <td><center><img border="0" src="ku2.gif" width="144" height="219"></center></td> <td><center><img border="0" src="ku3.gif" width="305" height="202"></center></td> </tr> <tr> <td><center>อนุสาวรีย์สามบูรพาจารย์ (สามเสือเกษตร)</center></td> <td><center>พระพิรุณทรงนาค</center></td> <td><center>อาคารสารนิเทศ 50 ปี</center></td> </tr> <tr> <td><center><img border="0" src="ku4.gif" width="290" height="191"></center></td> <td><center><img border="0" src="ku5.jpg" width="118" height="179"></center></td> <td><center><img border="0" src="ku6.jpg" width="283" height="186"></center></td> </tr> <tr> <td><p align="center">หอประชุมใหญ่</td> <td><p align="center">หออนุสรณ์ 60 ปี มก.</td> <td><p align="center">ศาลาหกเหลี่ยม</td> </tr> </table> </body> </html>

นอกจากการนำข้อความหรือรูปภาพใส่ในตารางแล้ว ยังสามารถสร้างการเชื่อมโยง (link) ในตารางได้เช่นเดียวกัน โดยการนำเอา Tag คำสั่ง การเชื่อมโยง (link) <a href="...>ข้อความหรือรูปภาพ</a> วางครอบบริเวณข้อความหรือรูปภาพที่เราต้องการทำ link เช่น