การเพิ่มสีสันให้กับขอบตาราง

ตารางเป็นองค์ประกอบหนึ่งที่มักนิยมจะนำมาใช้ในการสร้างโฮมเพจ ถ้าทำให้ตารางให้มีสีสัน โฮมเพจก็จะน่ามอง เทคนิคนี้จะเป็นการแนะนำ การใส่สีให้ขอบตารางด้วยวิธีง่ายๆ ดังนี้

1. เริ่มจากการสร้างตารางขึ้นมา 1 ตาราง โดยกำหนดค่าดังนี้

• ความกว้าง=200
• border=0
• cellspacing=0
• cellpadding=1
• Background Color เป็นสีดำ

<table width="1" border="0" cellpadding="1" cellspacing="0">
  <tr bgcolor="#000000"> 
   <td>&nbsp;</td>
  </tr>
</table>

จะได้ตารางแบบข้างล่างนี้

2. แล้วสร้างตารางอีกอันไว้ในตารางอันแรก โดยกำหนดค่าดังนี้

• ความกว้าง=200
• border=0
• cellspacing=2
• Background Color เป็นสีขาว

<table width="1" border="0" cellpadding="1" cellspacing="0">
  <tr bgcolor="#000000"> 
    <td> 
      <table width="200" border="0" cellspacing="2">
        <tr bgcolor="#FFFFFF"> 
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        </tr>
      </table>
    </td>
  </tr>
</table>

จะได้ตารางที่มีขอบสีดำข้างล่างนี้ การใส่สีขอบตารางก็เพียงสร้างตาราง 2 อันมาซ้อนกัน โดยแต่ละอันให้กำหนดcellpadding กับ cellspacing ให้มีค่าต่างกันจะทำให้เกิดช่องว่าง ซึ่งจะกลายมาเป็นขอบตารางนั่นเอง