ใช้ฟอนต์ออนไลน์ ไม่ต้องติดตั้งฟอนต์ HTML

ใช้ฟอนต์ออนไลน์ ไม่ต้องติดตั้งฟอนต์ HTML บทความนี้สอนใช้งานฟอนต์แบบออนไลน์ ผ่านบริการของ Google Fonts โดยรองรับการโหลดฟอนต์ผ่าน link และ import ใช้งานร่วมกับ font-family สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง ใช้ฟอนต์ออนไลน์ ไม่ต้องติดตั้งฟอนต์ HTML

1. เข้าเว็บไซต์ Google Fonts ตามลิงก์ด้านล่าง จากนั้นกดคลิกฟอน์ดที่ต้องการใช้งานแบบออนไลน์

https://fonts.google.com/

2. สมมติเลือกฟอนด์ออนไลน์ชื่อ Roboto จากนั้นเลือนลงมาด้านล่างกด Regular 400 + เพื่อใช้งานฟอน์ดดังกล่าวแบบออนไลน์

3. เลือกเมนู icon สุดท้ายด้านขวาบนของจอ เมนู View selected families จากนั้นคัดลอกโค้ดไปใส่ในเว็บไซต์ที่ต้องการใช้ฟอนต์ออนไลน์ โดยมี 2 แบบ คือผ่านแท็ก <link> และ @import ให้เลือกตามสะดวก ตัวอย่างเลือกแบบ @import จากนั้นใช้คำสั่ง font-family เพื่อแสดงฟอนต์ออนไลน์บนหน้าเว็บไซต์

<style>
	@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
</style>

<style>
	font-family: 'Roboto', sans-serif;
</style>