วิธีใช้งาน Google Fonts สำหรับเว็บไซต์ และงานมัลติมีเดีย

เว็บไซต์ Google Fonts -- https://fonts.google.com -- โดยสามารถเลือกดูเฉพาะภาษาที่ต้องการ เช่น Language: Thai (ภาษาไทย) เป็นต้น

Google Fonts

วิธีนำ Google Fonts ไปใช้แสดงผลในเว็บไซต์

1. กดเครื่องหมาย + (ปุ่มวงกลมสีแดง) มุมขวาของกรอก font ที่ต้องการ

Google Fonts

2. เมื่อเลือก font ได้แล้ว ระบบจะแสดงแถบข้อมูลรายการ font ที่เราต้องการใช้

Google Fonts

3. เลือกใช้คำสั่ง @import ไฟล์ css จาก Google Fonts ไปวางในไฟล์ .css ในเว็บไซต์ของเรา และกำหนด "font-family" ให้กับ selector แต่ละตัว

เช่น h1 { font-family: 'Chonburi', cursive; } เป็นต้น

Google Fonts

วิธีดาวน์โหลด Google Fonts ไปใช้กับงานมัลติมีเดีย (เช่น Adobe Photoshop CC)

1. เมื่อเลือก font ได้แล้ว ให้เลือกเมนู ดาวน์โหลด

Google Fonts

2. ทำการแตกไฟล์ .zip ที่ได้ ภายในจะมี font ที่เราต้องการใช้ ให้คลิกขวาเลือกเมนู Install (ติดตั้ง) ลงในระบบปฏิบัติการ -- ในภาพคือเมนูของ Windows 10

Google Fonts

3. เมื่อเปิดโปรแกรม Adobe Photoshop CC จะพบรายชื่อ font ที่ติดตั้งใหม่ อยู่ในรายชื่อ font ทั้งหมด

Google Fonts

ความคิดเห็น

Recent content