วันเสาร์ที่ 25 สิงหาคม พ.ศ. 2555

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

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

การสร้างตาราง ลงใน เว็บเพจมีประโยชน์มหาศาล เราสามารถ ประยุกต์ นำไปใช้ได้หลายอย่าง เพื่อเป็นการเพิ่มสีสันความสวยงามของเว็บเพจ การสร้างตาราง ในเว็บเพจก็ไม่แตกต่างจากการสร้างตารางบนแผ่นกระดาษทั่ว ๆ ไป เราเคยทำตารางอย่างไร ก็สามารถสั่งให้เว็บเพจของเรา ทำอย่างนั้นได้ เช่นกัน ต่างกันที่ว่าในเว็บเพจเราไม่สามารถที่จะ นำเอาปากกา ดินสอ ไม้บรรทัด หรืออุปกรณ์ สำหรับเขียนตารางเข้าไปเขียนบนจอภาพได้ 
                 

 -Tag table
                  ตารางมีการกำหนดด้วยแท็ก <table>
ตารางแบ่งออกเป็นแถว (ที่มีแท็ก <tr>) และแต่ละแถวจะแบ่งออกเป็นเซลล์ข้อมูล (ที่มีแท็ก <td>) td ย่อมาจาก "ข้อมูลตาราง" และถือเนื้อหาของเซลล์ข้อมูล แท็ก <td> สามารถมีข้อความการเชื่อมโยง, ภาพ, รายการ, รูปแบบ, ตารางอื่น ๆ ฯลฯ

width การปรับความกว้าง

            การปรับความกว้างของตาราง สามารถทำได้ดังนี้

ตัวอย่างโค้ด
           
            <table border =1 width =40%>

ตัวอย่าง


ผลที่ได้

Height การปรับความสูง

          การปรับความสูงของตาราง สามารถทำได้ดังนี้

ตัวอย่างโค้ด
           
            <table border =1 height =30%>

ตัวอย่าง


ผลที่ได้

Align การจัดตำแหน่ง
       
       การจัดตำแหน่งของตารางสามารถทำได้ดังนี้

ตัวอย่างโค้ด

       ** เนื่องจากการแทรกตารางเริ่มแรกจะชิดซ้ายอยู่แล้ว

       <table border =1 width=30% align = "center">
       <table border =1 width=30% align = "right">
     

  ตัวอย่าง                                   
การจัดอยู่กึ่งกลาง

ผลที่ได้



ตัวอย่าง
การจัดแบบชิดขวา


ผลที่ได้




Colspan การรวมเซล์

           การรวมเซลล์สามารถทำได้ดั้งนี้

ตัวอย่างโค้ด

           การรวมเซลล์ ต้องใส่จำนวนของแถวที่จะใส่ด้วย 
          
           <td colspan =4 align="center">........</tr>



ตัวอย่าง


ผลที่ได้


แหล่งอ้างอิง




26 สิงหาคม 2555
            

ไม่มีความคิดเห็น:

แสดงความคิดเห็น