Home » , , » โค้ดสร้างตาราง ในบทความ บล็อก หรือเว็บไซต์

โค้ดสร้างตาราง ในบทความ บล็อก หรือเว็บไซต์

วิธีสร้างตารางในบทความ บล็อก หรือเว็บไซต์ ตาราง HTML
ขั้นตอน 
เขียนบทความ>>HTML>>คัดลอกโค้ดด้านล่าง>>วางลงบทความ>>คลิก เขียน>>แทนเลข1ด้วยข้อความหรือรูปภาพ
**หมายเหตุ 
"2" คือขนาดเส้นรอบนอก
"5" คือขนาดเส้นรอบใน,ชิดใน
แทน ด้วยข้อความหรือรูปภาพ

คัดลอกโค้ดด้านล่างไปใช้ได้เลยครับ
***********************************
1
โค้ดตาราง1ช่อง
<table border="2" cellpadding="5" cellspacing="5">
<tbody>
<tr>
<td valign="bottom" width="30%">1</td></tr>
<tr>
</tbody></table>

************************************
1 2
1 2
โค้ดตาราง2x2ช่อง
<table border="2" cellpadding="5" cellspacing="5">
<tbody>
<tr>
<td valign="bottom" width="30%">1</td>
<td width="30%">2</td>
</tr>
<tr>
<td valign="bottom" width="30%">1</td>
<td width="30%">2</td>
</tr>
<tr>
</tbody></table>
</div>

*****************************
โค้ดตาราง3x2
1 2 3
1 2 3

<table border="2" cellpadding="5" cellspacing="5">
<tbody>
<tr>
<td valign="bottom" width="30%">1</td>
<td width="30%">2</td>
<td width="30%">3</td>
</tr>
<tr>
<td valign="bottom" width="30%">1</td>
<td width="30%">2</td>
<td width="30%">3</td>
</tr>
<tr>
</tr>
</tbody></table>
</div>
****************************
โค้ดตาราง4x2
1 2 3 4
1 2 3 4
<table border="2" cellpadding="5" cellspacing="5">
<tbody>
<tr>
<td valign="bottom" width="30%">1</td>
<td width="30%">2</td>
<td width="30%">3</td>
<td width="30%">4</td>
</tr>
<tr>
<td valign="bottom" width="30%">1</td>
<td width="30%">2</td>
<td width="30%">3</td>
<td width="30%">4</td>
</tr>
<tr>
</tr>
</tbody></table>
</div>
****************************
**หมายเหตุ
2=ขนาดของเส้นกรอบนอก
5=ขนาดของช่อง
4=ความห่างของเส้นกรอบนอก และกรอบใน
ลองปรับขนาดได้ตามใจชอบครับ
<table border="2" cellpadding="5" cellspacing="4">
.............................................................
โค้ดต่อไปนี้ก็จะได้แบบข้างล่างครับ
<table border="7" cellpadding="0.1" cellspacing="0.1"><tbody>
<tr> <td valign="bottom" width="30%">1</td> <td width="30%">2</td> <td width="30%">3</td> </tr>
<tr> </tr>
</tbody></table>

2 3

เราสามารถแทรกรูปภาพได้ตามต้องการ
อ้าวเฮ้ย!!!!.....นี่แฟนฉ๊าน.
วันนี้