:: WebThaiDD.COM - ขุมทรัพย์ทางปัญญาของคนไทย •))) ------------
  เทคนิคการสร้างฟอร์มให้สวยงาม หลายคนมีปัญหาว่าเวลาที่เราสร้างฟอร์มทำไมข้อมูลต่างๆ ไม่เรียงกัน ถึงเรียงแต่เอ๊ะทำไมช่องมันยังห่างอีก ถ้าใครมีปัญหาแบบนี้อ่านบทความนี้เลยครับ

ขั้นตอนการทำ

1. สร้างเอกสารที่เราจะสร้าง Form ขึ้นมา

2. หลังจากนั้นให้เราสร้าง Form ขึ้นมาแล้วใส่ตารางลงไปใน Form ที่เราสร้างขึ้นมาขนาด 1x1 ดังภาพ

3. หลังจากนั้นให้เราสร้าง Form ที่เราต้องการลงไปในตารางที่เราสร้าง

4. หลังจากนั้นให้เราแก้โค้ด Form เล็กน้อย โดยให้นำ Tag Form ไปใว้ระหว่าง Tag <TR><TD>

โค้ดก่อนทำการแก้ไข
<html>
<head>
<title>Un title page</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874">
</head>
<body bgcolor="#FFFFFF">
<form name="form1" method="post" action="">
<table width="100%" border="0" cellspacing="5" cellpadding="0">
<tr>
<td>ชื่อ :
<input type="text" name="textfield">
ที่อยุ่ :
<input type="text" name="textfield2">
<input type="submit" name="Submit" value="Submit">
<input type="reset" name="Submit2" value="Reset">
</td>
</tr>
</table>
</form>
</body>
</html>

โค้ดที่ได้ทำการแก้ไขแล้ว
<html>
<head>
<title>Un title page</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874">
</head>
<body bgcolor="#FFFFFF">
<table width="100%" border="0" cellspacing="5" cellpadding="0">
<tr>
<form name="form1" method="post" action=""> //นำโค้ดมาไว้ระหว่าง Tag
<td>ชื่อ :
<input type="text" name="textfield">
ที่อยุ่ :
<input type="text" name="textfield2">
<input type="submit" name="Submit" value="Submit">
<input type="reset" name="Submit2" value="Reset">
</td>
</form>
</tr>
</table>
</body>
</html>

5. ผลที่ได้ใน Dream เราจะไม่เห็นเส้นฟอร์มแล้วใช่ไหมครับ แต่ฟอร์มยังใช้งานได้อยู่นะครับ