NECTEC
NSTDA
Home
Computer
Program
Internet & Web
Graphics
CAI
Multimedia
Electrical Power
General Education
Special Education
Links
Webmaster
Web Design by HTML

การสร้างตาราง

แท็ก < TABLE > ใช้สร้างตาราง ซึ่งในเว็บเพจส่วนใหญ่หรือเกือบทุกเว็บเพจมักใช้แท็กนี้กันทั้งนั้น ด้วยเหตุผลที่ว่าตารางสามารถประยุกต์ใช้งานได้หลาย แบบตั้งแต่ใช้เป็นตารางธรรมดาเพื่อแสดงค่าตัวเลขทางสถิติหรือตัวเลขที่มีความสัมพันธ์กัน ซึ่งการใช้ตารางนำเสนอข้อมูลแบบนี้ทำให้เห็นการเปรียบเทียบ ที่ชัดเจน ต่อมามีการประยุกต์ใช้ตารางกับข้อมูลประเภทอื่นๆ เช่น ข้อความ หรือรูปภาพเพื่อช่วยออกแบบโฮมเพจ (คือเว็บเพจแรกที่จะแสดงให้เห็นเมื่อเข้าสู่ เซิร์ฟเวอร์นั้น) หรือเว็บเพจทั่วๆ ไปด้วย จนบางครั้งดูไม่ออกว่าเป็นตาราง ในบทนี้จะค่อยๆ อธิบายจากการทำตารางง่ายๆ ไปจนถึงการใช้ตารางช่วยออกแบบเว็บเพจ

โครงสร้างของตาราง

โครงสร้างตารางโดยทั่วไปจะประกอบไปด้วยแถวและคอลัมน์ โดยช่องข้อมูลที่อยู่ในแนวนอนเดียวกันก็คือแถว และช่องข้อมูลที่อยู่ตรงกันในแนวตั้งก็คือ คอลัมน์นั่นเอง

<TABLE>
    <CAPTION>.........</CAPTION>
        <TR>
              <TH>.........</TH>
              <TH>.........</TH>
        </TR>
        <TR>
                <TD>.........</TD>
                <TD>.........</TD>
        </TR>
        <TR>
                <TD>.........</TD>
                <TD>.........</TD>
        </TR>
<TABLE>

  • <TABLE> กำหนดการสร้างตาราง และมีคำสั่งปิดคือ </TABLE>
  • <CAPTION> เป็นการกำหนดคำ หรือข้อความอธิบายตาราง และมีคำสั่งปิดคือ </CAPTION>
  • <TR> (Table Row) เป็นการกำหนดแถวของตาราง และมีคำสั่งปิดคือ </TR>
  • <TH> (Table Head) เป็นการกำหนดหัวเรื่องในคอลัมน์ และมีคำสั่งปิดคือ </TH>
  • <TD> (Table Data) เป็นการกำหนดข้อมูลในตาราง และมีคำสั่งปิดคือ </TD>