ใช้ font บนเว็บไซต์ตามใจ ด้วย Cufon |
|
การออกแบบเว็บไซต์ในปัจจุบันมีความหลากหลายมาก ทั้งในส่วนของดีไซน์ การจัดวางเลย์เอาต์ การให้สี การใช้ภาพประกอบ การใช้ฟ้อนท์ที่หลากหลาย ส่วนอื่นๆ อาจไม่มีปัญหามากนัก ในแง่ของการนำไปใช้จริงบนเว็บไซต์ ยกเว้นในส่วนของการใช้ฟ้อนท์ที่หลากหลาย เป็นที่ทราบว่าบนอินเทอร์เนตนั้น หากขึนไปใช้ฟ้อนท์แปลกๆ นอกจาก Tahoma หรือ Ms sans-serif อาจทำให้การแสดงผลเป็นภาษาต่างดาวแทน อาจมีการใช้ฟ้อนท์แปลกๆ เฉพาะหัวข้อใหญ่ หรือโลโก้ โดยเลี่ยงไปใช้เป็นภาพแทนตัวหนังสือ วันนี้ขอเสนอการแก้ปัญหาเรื่อง font บนเว็บด้วย Cufon วิธีทำ มีเพียง 4 ขั้นตอนง่า่ยๆ เท่านั้น ดังนี้ ส่วน head <script src="script/cufon-yui.js" type="text/javascript"></script> <script src="script/penthai_900-penthai_700-penthai_italic_900-penthai_italic_700.font.js" type="text/javascript"></script> <script type="text/javascript"> Cufon.replace('h1,h2'); </script> <style type="text/css"> h1 { font-size:60px; color: #2A2A2A ; text-align:center} h1 span { color: #A0A0A4} h2 { font-size:42px; text-align:center; } </style>ส่วน body <h1>คำสั่ง <span>WordPress</span> เบื้องต้น</h1> <h2>บทที่ 1 sidebar</h2>ตามตัวอย่าง เมื่อไรก็ตามที่เราเรียกใช้คำสั่ง h1 และ h2 มันจะเปลี่ยนเป็นฟ้อนท์ที่เราต้องการทันที และหากใช้คำสั่ง span ใน h1 จะมีสีตามที่เราระบุไว้ ที่มา : http://wiki.github.com/sorccu/cufon/usage ที่มา :http://www.select2web.com/jquery/font-on-web-by-cufon.html |
Cufon
|
|