วันนี้แอดมินมีตัวอย่างการใส่ลูกเล่นให้กับข้อความ ด้วย css3 มาฝากแฟนๆกันจ้า ลองไปดูตัวอย่างกันก่อนเนาะ แล้วสนใจตัวอย่างไหนก็สามารถดูโค้ดและนำไปปรับใช้กับเว็บไซต์ได้เลยจ้า

CSS Gradient Text

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


CSS3 text-shadow effects

การใส่เงาให้กับตัวอักษร ไม่ว่าจะเป็นแนวนอน, แนวตั้ง, มีความเบลอมากหรือเบลอน้อยก็สามารถทำได้โดยใช้ css3


-webkit-background-clip:text CSS effect

การใส่พื้นหลังให้กับข้อความ ช่วยให้ข้อความมีมิติ และสวยงาม


Squiggly

การสร้างความเคลื่อนไหวให้กับข้อความ ช่วยให้ดูเหมือนว่าข้อความสามารถขยับได้


CSS-Only Countdown Clock

css สร้างนาฬิกานับถอยหลัง


CSS3 Text Animation Effect

การสร้างข้อความนิเมชั่น ให้โชว์และซ่อนข้อความได้


Text with Texture

การสร้างข้อความให้มีพื้นผิว


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

ขอบคุณข้อมูล http://commte.net/
ขอบคุณข้อมูล Codepen
เรียบเรียงโดย YUDYMOVEE

Comments