วิธีนำ Google Font มาใช้ในเว็บไซต์

19 ก.พ. 2016 , 24,778 Views   , หมวดหมู่ WebDesign ทุกหมวดหมู่ โค๊ดดิ้ง   , ป้ายกำกับ:,


googlefont

  1. เริ่มจากเข้าไปที่ https://www.google.com/fonts
  2. หากต้องการใช้ฟอนต์ไทย ฟอนต์ไทยใน google font ตอนนี้มีอยู่ 3 ฟอนต์ (อนาคตอาจจะมีเพิ่ม) ตรง Script เมนซ้ายมือ ให้เลือกเป็น Thai
  3. เลือกฟอนต์ที่ต้องการ โดยคลิกตรงปุ่มสีฟ้า Add to Collection
  4. กดปุ่ม Use เพื่อที่จะนำไปใช้งาน
  5. จากนั้นก็จะมาอีกหน้านึงสำหรับเลือก style ของฟอนต์ เช่น ตัวเอียง ตัวหนา เป็นต้น แล้วก็จะมีโค๊ดสำหรับนำไปใส่ในส่วนของ <head> ของเว็บไซต์ตามตัวอย่างด้านล่างgooglefont-2ตัวอย่างโค๊ดที่นำไปใส่ใน <head>

     
  6. เพิ่มฟอนต์ใน CSS สำหรับนำไปใช้งาน

     

ตัวอย่าง

 

See the Pen JGqrLg by Suttipong Choysakda (@nathanbc46) on CodePen.

เพิ่มเติม ฟรีฟอนท์

https://github.com/jenskutilek/free-fonts/tree/master/Noto


ป้ายกำกับ:,