เคยมีน้องแฟนเว็บถามมาว่า พี่..ผมอยากทำตัวอักษรเรืองแสงแบบเว็บนี้ทำไงหรือครับ (ค่ะ) อันที่จริงผมก็ตอบให้เขาไปบ้างแล้ว ก็ว่าจะเอามาทำเป็นบทความมาตั้งนาน ไม่ได้ทำเสียที ครั้งนี้เริ่มหมดมุขในการเขียน Tricks เลยนึกขึ้นได้...จึงนำมาแนะนำกัน

DWTHAI.COM

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

1. ให้ทำการสร้างตารางขึ้นมา 1 ตารางมี 1 Column - 1 Row (Insert Table)
2. จากนั้นให้ทำการพิมพ์ข้อความที่คุณต้องการทำเป้นตัวอีกษรเรืองเเสงขึ้นมา ดังตัวอย่าง

DWTHAI.COM

3. จากนั้นให้เราทำการสร้าง CSS Style ขึ้นมา โดยให้เปิดหน้าต่าง Css Styles ขึ้นมา ดังรูป จากนั้นให้ทำการ Click ที่ Icon ที่เป็นรูปเครื่องหมายบวก (+) ดังรูป

4. เมื่อ CLick ไปที่ Icon ดังกล่าวแล้วโปรแกรมจะทำการเปิดหน้าต่างใหม่ขึ้นมาให้เราทำการตั้งชื่อของ CSS ดังรูป ในที่นี้ผมตั้งชื่อว่า .fontX จากนั้น Click ที่ปุ่ม OK เพื่อทำขั้นตอนต่อไป

5. เมื่อเราได้ทำการตั้งชื่อ CSS เป็นที่เรียบร้อยแล้ว โปรแกรมจะทำการเปิดหน้าต่างใหม่ขึ้นมาให้เราทำการกำหนดค่าดังนี้

ที่เมนู Category ให้เลือกไปที่ Extensions เพื่อกำหนดค่าให้กับ Extensions ของ CSS จากนั้นทางขวามือ เราจะพบ Select Box ให้เรากำหนดค่าต่าง ๆ ให้เราเลือกไปที่ Filter เลือกไปที่ Glow(Color=?, Strength=?) เมื่อเลือกแล้วให้ทำการกำหนดค่าดังนี้
- Color = ค่าสีที่ต้องการ
- Strength = ความกว้างของรัศมีของสีแสงที่จะกระจายออกไป ให้เรากำหนดเป็นค่าตัวเลข
ตัวอย่าง : Glow(Color=RED, Strength=8) คือ กำหนดสีที่จะกระจายออกไปเป็นสีแดง (RED) และมีรัศมีการกระจายที่ 8 เป็นต้น

เมื่อเราได้ทำการกำหนดค่าต่าง ๆ แล้วให้เราทำการกดที่ปุ่ม OK

6. จากนั้นให้กลับมาที่ตารางที่เราทำการพิมพ์ข้อความที่จะทำให้ปรากฏเป็นอักษรเรืองแสงอีกครั้ง เพื่อมากำหนด CSS ให้กับข้อความที่เราต้องการ ให้เรานำ Mouse ไปวางอยู่เหนือเซลของตารางที่มีข้อความของเราอยู่ แล้วทำการ Click ขวา แล้วเลือกไปที่เมนู CSS Style แล้วเลือกไปที่ชื่อ CSS ที่เราทำการสร้างขึ้นมาไว้เมื่อขั้นตอนก่อน ซึ่งในบทความนี้ผมตั้งชื่อ CSS ผมไว้ว่า .fontX ดังรูป

7. จากนั้นให้เราทำการ Save เว็บเพจของเรา แล้วทำการทดสอบดูผลกับ Web Browser ของเรา
8. หากข้อความไม่เป็นไปตามผลที่เราต้องการให้เราทำการตรวจสอบว่า TAG <TD> ของ TABLE เรามีการ Add CSS ดังที่เรากำหนดหรือไม่...หากโปรแกรมทำการ ADD CSS เข้าไปที่ TAG อื่นที่ไม่ใช่ TAG ของตาราง ข้อความก็จะไม่ปรากฏกผลแบบที่เราต้องการ

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

ปล. Tricks นี้แสดงผลเฉพาะใน Internet Explorer !