เรื่อง :: ใส่สีสันให้ Field กรอกข้อมูล

หลายท่านคงจะเคยเห็นฟิลด์สำหรับกรอกข้อมูลนะครับ หลายท่านอาจจะเห็น เอ...ทำไมเขาใส่สีสันลงไปในฟิลด์กรอกข้อมูลเหล่านั้นได้ เขาทำได้อย่างไร เพราะพอเราสร้างฟอร์มขึ้นมาทีไรก็ทำได้แต่แบบนี้ >>>

แต่เว็บของเขาเป็นแบบนี้ >>>

เขาทำได้อย่างไร...ครั้งนี้เราจะมาแนะนำกันครับ...

---

:: วิธีกาารทำ ::

1. ให้เราสร้าง Form พร้อมกับฟิลด์สำหรับกรอกข้อมูลต่าง ๆ ให้เรียบร้อย จากนั้นให้เราเปิดหน้าต่าง CSS Styles ขึ้นมาเพื่อกำหนดค่าครับ
2. ที่หน้าต่าง CSS Styles ให้เราคลิ๊กไปที่ New Style ดังรูป Pic.1

Pic.1

เมื่อ click ไปแล้วเราจะได้หน้าต่างใหม่เปิดขึ้นมา ให้เราทำการกำหนดเลือกไปที่ Redefine HTML Tag ดังรูป Pic.2 ครับ แล้วกลับมาเลือกที่ตัวเลือก Tag : เป็น input นะครับ (Pic.2)

แล้วให้ทำตามขั้นตอนต่อไป

Pic.2

3. เมื่อเราทำการกำหนดค่าที่หน้าต่าง New CSS Style ไปแล้วให้เรากดที่ปุ่ม OK แล้วโปรแกรมจะทำการเปิดหน้าต่างใหม่ขึ้นมา ดัง Pic.3 ที่หน้าต่างนี้ให้เรากำหนดค่าต่าง ๆ ดังต่อไปนี้

Pic.3

ที่เมนูทางซ้ายมือ ให้เราเลือกไปที่ Background จากนั้น option ทางขวามือของหน้าต่าง CSS Style definition for input จะเปลี่ยนไป ให้เราเลือกสีของ Field ข้อมูลจาก option ที่ชื่อว่า Background Color : ครับ เมื่อสีสันตามที่ต้องการเลือกได้แล้วให้เราทำการ Click ที่ปุ่ม OK ของหน้าต่างนี้

---------------------- เป็นอันเสร็จการกำหนดสีให้แก่ Field Form นะครับ -------------------

---

ps.ให้ทำการ Preview ดูกับ Browser นะครับ และ เ รายังสามารถกำหนดลักษณะอื่น ๆ ลงไปได้อีกตาม Attribute ที่มีของ CSS ให้ลองใช้งานกันดูนะครับ.

................................................................................................................................................................................