ออกแบบเว็บไซต์ เขียนโปรแกรม ทำเว็บไซต์

เว็บสวยด้วย CSS3 ตอนที่ 1

by admin on พ.ย..21, 2010, under Web Design

จริง ๆ แล้ว CSS3 ก็ออกมาได้สักพักนึงแล้ว แต่ก็ยังไม่ค่อยรู้เรื่องอะไรเลย วันนี้จึงนำเอาฟังก์ชั่นการใช้งานดีมาฝากกัน ซึ่งคิดว่าน่าจะเป็นฟังก์ชั่นการทำงานที่เรียกใช้กันอยู่บ่อยๆ ชักช้าอยู่ใย….มาดูกันเลยดีกว่าว่าเราจะใช้  CSS3 จัดการได้อย่างไรบ้าง  ไปเลย…

1. RGBA

ปกติแล้วเราจะคุ้นเคยกับ RGB (แดง เขียว น้ำเงิน ) กันมากกว่าแล้ว A ละคืออะไร ใน CSS3 ได้เพิ่มการใช้งาน A ขึ้นมาอีกค่า นั่นคือ Alpha หรือจะพูดให้เข้าใจง่าย ๆ ก็คือ Transparency หรือ ค่าความโปร่งใส นั่นเอง โดยเราสามรถกำหนดค่าให้กับ A ได้ ดังนี้ 0=โปร่งแสง 1=ทึบแสง และเราสามารถกำหนดค่าเป็นทศนิยมได้ตามความต้องการค่ะ รูปแบบการเรียกใช้งาน เป็นดังนี้ค่ะ background: rgba(ค่า r, ค่า g, ค่า b, ค่า a); ตัวอย่าง เช่น


ฟังก์ชั่นนี้สามารถนำไปประยุกต์ใช้ได้กับทุกที่ที่เรียกใช้  RGB เช่น font color, border color, background color, shadow color, etc.

2.Text Shadow

ต่อไปนี้การทำเงาหรือการสร้างมิติให้กับตัวอักษรต่างๆในการทำเว็บก็ไม่ใช้เรื่องยากอีกต่อไป ซึ่งจะทำการจัดการ แกน X และ แกน Y ของข้อความนั่นเอง โดยมีรูปแบบการเรียกใช้งาน ดังนี้ text-shadow: (ระยะแกนตั้ง X) (ระยะแกนนอน Y) (ความเบลอ) (สีเงา); ตัวอย่าง เช่น


เอาละพอหอมปากหอมคอ หัวห้อหน้าจะมีอะไรดีๆมาฝากอีก อย่าลืมติดตามกันนะค่ะ


Leave a Reply

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Blogroll

A few highly recommended websites...