Sitthiphorn Anthawonksa

FORM ตอนที่ 1

รูปแบบของ form เป็นอีกเรื่องนึง ที่หลายๆ ท่านยังงงอยู่ ว่ามันจะต้องเขียนออกมายังไงให้ถูกหลัก XHTML และสามารถจัดการรูปแบบด้วย CSS ได้อย่างถูกต้อง สวยงาม และตรงตามความต้องการมากที่สุด ผมคงต้องแยก บทความออกเป็น 2 ตอน เพื่อทำให้ข้อมูลในเว็บดูเหมือนเยอะ อิอิ อ๊ะ ม่ายช่าย… ที่ต้องแยกเป็น 2 ตอน เพราะ จะเน้นการทำ form 2 ลักษณะนั่นเองครับ

ในการเขียน form นั้น สิ่งหนึ่งที่ขาดไม่ได้ก็คือ <label> หรือ ชื่อของ ตัวรับค่าแต่ละตัวนั่นเอง เช่น


<label for=“name” >ชื่อ : </label>
<input name=“name” id=“name” type=“text” />

ol, ul, li

สิ้นสุดกันทีกับการใช้ ตาราง ผิดที่ผิดเวลา หลายคนคงเคยเป็นเหมือนผม ตอนหัดทำเว็บใหม่ๆ หรือทำเว็บจนชิน

CSS External@import

[caption id="attachment_314" align="alignnone" width="452" caption="ภาพโครงสร้าง ตัวอย่างการเรียกใช้ css"][/caption]

การใช้ css แบบ External เป็นสิ่งที่ผมอยากจะแนะนำครับ เพราะความสะดวก และง่ายในการแก้ไข เฉพาะ ไฟล์ CSS นั้นๆ ไป ไม่ต้องมัวมาเกิดหน้าเว็บ แล้วเข้ามาแก้ กรณี Internal และแก้ในแถว กรณีเขียนแบบ Inline ท่านสามารถเปิด ไฟล์ .css

table, tr, th, td (ตาราง โอ้วเยช!)

หลายคนกำลังรอคอยเรื่องการใช้ตารางแบบ xhtml อยู่ แต่ความแตกต่าง ระหว่าง html 4.0 กับ xhtml 1.0 มันก็ไม่มีอะไรมากมายนักหรอกครับ แต่ว่า เขาพัฒนาให้มันเฉพาะเจาะจงมากยิ่งขึ้นนั่นเอง เช่นว่า ตารางที่คุณกำลังเขียนนั้นเอาไว้ใช้กับข้อมูลอะไร ย้ำนะครับว่า เอาไว้แสดงผลข้อมูล ไม่ได้แสดงผลกราฟฟิคเลย์เอ้าท์

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

ระยะห่างระหว่าง Elements ด้วย Margin

เมื่อไรก็ตามที่เราต้องการ Elements หรือวัตถุที่มากกว่า 2 ชิ้นขึ้นไปมาเรียงต่อ หรือนำมาชิดติดกัน margin ถือเป็นคำสั่งหนึ่งที่ใช้เว้นช่องว่าระยะห่างระหว่าง element ถึง element

คือ ถ้าเราเพิ่ม margin ให้กับ elements ใดๆ แล้ว ช่องว่างที่เกิดจากค่าของ margin นั้นจะเป็นพื้นที่ว่างเปล่า มองทะลุปรุโปร่งถึงข้างหลัง ตามขอบทุกๆ ด้านที่เราใส่ค่าเข้าไป และไม่แสดงพื้นหลังของ element และแสดงค่าจากในออกนอก ซึ่งไม่เหมือนกับการใช้ padding เพื่อกันข้อมูลออกจากขอบของ element ซึ่งจะกันเข้าข้างใน หรือจะให้ค่าจากนอกเข้าในนั่นเอง

POST NEW YEAR ผมต้องทำอะไรบ้าง

ความตั้งใจหลากหลายที่อยากจะทำ เช่น ทำเว็บ ไทยซีเอสเอส ให้สมบูรณ์ ผมต้องค่อยๆ วางแผนใหม่ ว่าก้าวต่อไปมันจะเป็นยังไงบ้าง และมีเรื่องโปรแกรมมาให้ปวดหัวได้แต่ละวัน พอพูดถึงเรื่องโปรแกรมแล้วมีหลายท่านเหมือนกันที่ยังคิดว่าผมเป็นโปรแกรมเมอร์ ไม่ใช่ครับ ผมเขียนโปรแกรมพอได้ แต่ไม่เป็น! นั่นมันจึงเป็นปัญหาใหญ่อีกอย่าง เมื่อมันมาทับถมกับการที่ผมต้องเขียนบทความเรื่อง CSS, XHTML และ เรื่องของ W3C ก็คงได้แต่ทยอยแก้กันไป

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

สำหรับยุค post new year ของผม คงต้องสาละวนไปกับเรื่อง CSS นี่อีกพักใหญ่ แต่ควาดว่าอีกไม่นาน เว็บนี้คงลงตัว และเดินไปตามทางที่ควรจะเป็น

Back to Top