การใส่สีพื้นหลังให้กับตารางและการแทรกรูปภาพ

การใช้คำสั่งใส่พื้นหลังให้ตารางและการนำรูปภาพมาใส่ในตาราง

ใส่พื้นหลังให้ตาราง การใส่พื้นหลังให้กับตาราง และช่องของตาราง ลักษณะพื้นหลังมี แบบคือ    

    1.  แบบที่เป็นสี ใช้คำสั่ง bgcolor    2.   แบบที่เป็นรูปภาพ ใช้คำสั่ง background 




รูปแบบการใช้คำสั่ง
<TABLE BORDER="n" bgcolor="n1"> <TR>
<TABLE BORDER="n" background="ชื่อแฟ้มข้อมูลภาพ">

n ตัวเลขกำหนดขนาดของตาราง
n1 ตัวเลขกำหนดรหัสสี  หรือ ชื่อสีตัวอย่างการใช้คำสัง
 คำสั่ง
<H4>ใส่พื้นหลังเป็นสี</H4>
<TABLE BORDER="1" bgcolor="yellow">
    <TR><TD>ชื่อ</TD><TD>สกุล</TD></TR>  
    <TR><TD>นางสาวจีราภรณ์</TD><TD>พิศราจันทร์</TD></TR>
</TABLE>
<H4>ใส่พื้นหลังเป็นรูปภาพ</H4>
     <TABLE BORDER="1"background="images/flower.gif">
     <TR><TD>ชื่อ</TD><TD>สกุล</TD></TR>  
     <TR><TD>นางสาวจีราภรณ์</TD><TD>พิศราจันทร์</TD></TR>
</TABLE>
<H4>ใส่พื้นหลังให้กับช่อง</H4>
<TABLE BORDER="1">
   <TR><TD background="images/flower.gif">ชื่อ</TD><TD> สกุล</TD></TR>                      
   <TR><TD>นางสาวจีราภรณ์</TD><TD bgcolor="red">พิศราจันทร์</TD></TR>
</TABLE> 
ผลลัพธ์ที่ได้จากการใช้คำสั่ง
ใส่พื้นหลังเป็นสี
ชื่อ
สกุล 
นางสาวอารีย์
ใจดี
ใส่พื้นหลังเป็นรูปภาพ


ใส่พื้นหลังให้กับช่อง
ชื่อ
สกุล 
นางสาวอารีย์
ใจดี
 นอกจากการพิมพ์ข้อมูลต่าง ๆ ในตารางแล้ว  โปรแกรม HTML ยังสามารถนำรูปภาพต่าง ๆ มาใส่ในช่องตารางตามที่ต้องการได้อีกด้วย  โดยใช้คำสั่งต่าง ๆ ที่ได้เรียนไปแล้วมาประยุกต์  มีรูปแบบดังนี้
      <TD> <IMG SRC =" ชื่อแฟ้ม.นามสกุล"></ TD>   

ตัวอย่างการใช้คำสั่ง
 คำสั่ง
<H4>การแทรกรูปภาพในตาราง</H4>
<TABLE BORDER="1">
      <TR><TD> <IMG SRC ="images/running.gif"> </TD> <TD align="right">
มิคกี้เม้าส์</TD> </TR>
</TABLE>

ผลลัพธ์ที่ได้จากการใช้คำสั่ง


การแทรกรูปภาพในตาราง


มิคกี้เมาส์