การแทรกตาราง

<TABLE>...........</TABLE> เป็นคำสั่งที่กำหนดให้โปรแกรมเบราว์เซอร์สร้างตาราง

<TR>...........</TR> เป็นคำสั่งที่ใช้กำหนดแถว (ROW)

<TD>...........</TD>เป็นคำสั่งที่ใช้ในการกำหนดข้อมูลในแต่ละแถว

ตัวอย่าง โครงสร้างของการสร้างตารางในภาษา HTML

<TABLE> 

<CAPTION> ชื่อตาราง </CAPTION>

<TR>

<TH> ข้อมูลส่วนหัว </TH>

</TR> 

<TR> 

<TD> ข้อมูล </TD>

</TR>

<TR> 

<TD> ข้อมูล </TD>

</TR> 

</TABLE>

ตัวอย่าง การสร้างตาราง

                เมื่อพิมพ์ข้อมูลตามตัวอย่างเสร็จแล้วให้จัดเก็บชื่อ TEST_TABLE.HTM และทำการแสดง ผลลัพธ์บนเว็บเบราว์เซอร์จะได้ผลลัพธ์ ดังนี้

คำสั่ง ต่างๆที่ใช้ในการตกแต่งตารางของภาษา HTML 

BORDER ใช้กำหนดความหนาให้กับเส้นขอบของตาราง มีหน่วยเป็น Pixel 
ถ้าไม่ใส่คำสั่งนี้ไว้ด้วย BORDER ก็จะมีค่าเท่ากับ 1 ซึ่งเป็นค่าปกติ คือจะไม่เห็นเส้นขอบของตาราง

       จะได้ผลดังนี้

                                                                          

ALIGN ใช้กำหนดตำแหน่งการจัดวางตาราง มี 3 รูปแบบ คือ 

-LEFT คือ จัดตารางชิดซ้าย (ค่าปกติ) ของจอภาพ 
-RIGHT คือ จัดตารางชิดขวาของจอภาพ 
-CENTER คือ จัดตารางไว้กึ่งกลางของจอภาพ 

ตัวอย่าง การสร้างตารางอยู่กึ่งกลางจอภาพ

ทำการแสดงผลลัพธ์บนเว็บเบราว์เซอร์ สังเกตผลลัพธ์ที่ได้จะได้ผลลัพธ์ ดังนี้

WIDTH ใช้กำหนดความกว้างของตารางทั้งหมด มีหน่วย เป็น Pixel หรือ เปอร์เซ็นต์ ก็ได้ 

HEIGHT ใช้กำหนดความสูงของตารางทั้งหมด มีหน่วยเป็น Pixel หรือ เปอร์เซ็นต์ ก็ได้ 

Colspan และ Rowspan 

คำสั่ง <TD  COLSPAN> เป็นคำสั่งในการรวมคอลัมน์เข้าด้วยกัน ตามค่าของจำนวนคอลัมน์ที่กำหนดไว้

รูปแบบคำสั่ง  <TD  COLSPAN = "Number">- COLSPAN คือ แอตทริบิวต์ที่ใช้ในการกำหนดการรวมคอลัมน์

- Numberคือ ค่าตัวเลขที่ใช้ในการรวมคอลัมน์เข้าเป็นคอลัมน์เดี่ยวกัน

                                            
คำสั่ง <TD  ROWSPAN> เป็นคำสั่งในการรวมแถวเข้าด้วยกัน ตามค่าของจำนวนแถวที่กำหนดไว้

รูปแบบคำสั่ง  <TD  ROWSPAN = "Number">- ROWSPAN คือ แอตทริบิวต์ที่ใช้ในการกำหนดการรวมแถว- Number คือ ค่าตัวเลขที่ใช้ในการรวมแถวเข้าเป็นแถวเดียวกัน

ผลลัพธ์

ที่มา

http://www.bankaeng.ac.th/k.npd/p28.htm

https://sites.google.com/site/cirayus/sux-kar-reiyn-ru/kar-srang-tarang