.
Head
       การสร้างตาราง

Start HTML
สร้างแบบฟอร์ม
สร้าง Frame
สร้างตาราง
Tricks ใน HTML
JavaScript
WWW Example
Home
ถาม - ตอบ
HTML

สร้าง ตาราง
การสร้างตารางจะเริ่มต้นด้วยคำสั่ง TABLE ดังนี้
<TABLE...>....</TABLE>
โดยมีคำสั่งย่อยเพื่อกำหนดลักษณะของตารางดังนี้
BORDER ใช้กำหนดขนาดของกรอบที่ล้อมรอบตาราง
เช่น <TABLE BORDER=2>...</TABLE>
ตารางที่ถูกสร้างขึ้นมาจะถูกล้อมรอบด้วยกรอบขนาดเท่ากับ 2
ALIGN ใช้กำหนดตำแหน่งของตารางภายในเพจ
เช่น <TABLE ALIGN=center>...</TABLE>
CELLSPACING ใช้กำหนดช่องว่างระหว่างเซลของตาราง
เช่น <TABLE CELLSPACING=3>...</TABLE>
CELLPADDING ใช้กำหนดช่องว่าระหว่างเซลในแนวตั้ง
เช่น <TABLE CELLPADDING=2>...</TABLE>
ตัวอย่าง สร้างตารางขนาด 2 x 2 ที่บรรจุด้วยตัวเลขตั้งแต่ 1-4 เริ่มแรกให้กำหนดลักษณะของตารางดังนี้
<TABLE BORDER=2 ALIGN=center CELLSPACING=3>
กำหนดจุดเริ่มต้นของแต่ละแถวในตารางด้วยคำสั่ง <TR> ดังนี้
<TR>
จากนั้นจะเริ่มต้นการแบ่งคอลัมน์ด้วยคำสั่ง <TD> ตามด้วยข้อความที่ต้องการแสดงในเซล
และปิดท้ายด้วย </TD> เพื่อแสดงการสิ้นสุดคอลัมน์
ในที่นี้เราต้องการแสดงเลข 1 ดังนั้นให้พิมพ์เลข 1 ลงไป
<TD> 1 </TD>
จากนั้นเริ่มต้นคอลัมน์ใหม่ด้วยคำสั่ง <TD> อีกครั้งแทรกเลข 2 เข้าไปแล้วปิดท้ายด้วย
</TD> อีกครั้ง
<TD> 2 </TD>
ณ ขณะนี้เราได้สร้างตารางขนาด 2 x 2 แถวแรกเสร็จแล้วดังนั้นให้ปิดท้ายด้วย </TR>
</TR>
ขั้นต่อมาให้กำหนดจุดเริ่มต้นของแถวถัดมาดังนี้
<TR>
หลังจากนั้นกำหนดจุดเริ่มต้นคอลัมน์และกรอกข้อมูลที่ต้องการแสดงเช่นเดิม
<TD> 3 </TD>
<TD> 4 </TD>
จากนั้นปิดท้ายด้วยคำสั่ง </TR> เพื่อแสดงการสิ้นสุดแถว
</TR>
แสดงการสิ้นสุดตารางด้วยคำสั่ง </TABLE>
</TABLE>
จะได้ดังนี้
<TABLE BORDER="2" CELLSPACING="3" ALIGN="center">

<TR>

<TD> 1 </TD>

<TD> 2 </TD>

</TR>

<TR>

<TD> 3 </TD>

<TD> 4 </TD>

</TR>

</TABLE>

ผลที่ได้
12
34


[ Home ] [ Start ] [ Form ] [ Frame ]

[ Table ] [ Tricks ] [ Java ]

1