W3.CSS อักษร
การทำเว็บที่สวยงาม!
ด้วย W3.CSS มันเป็นเรื่องง่ายมากที่จะเพิ่มแบบอักษรใหม่ไปยังหน้าเว็บ
- ใช้งานง่ายมาก (CSS และ HTML เท่านั้น)
- ไม่ จำกัด การใช้ห้องสมุดอักษรภายนอก (เช่นเดียวกับ Google อักษร)
- ทำงานในเบราว์เซอร์ที่ทันสมัย
การใช้ตัวอักษรชั้น
ทำเว็บ!
ในหัวของหน้าเว็บของคุณ (หรือในแผ่นงานสไตล์ของคุณ) สร้างชั้นตัวอักษร:
ตัวอย่าง
.w3-myfont {
font-family: "Comic Sans MS", cursive, sans-serif;
}
ในร่างกายของหน้าเว็บของคุณใช้ชื่อคลาส:
ใช้แบบอักษรภายนอก
ในหัวของหน้าเว็บของคุณมีตัวอักษรภายนอกและให้ตัวอักษรชั้นเรียน:
ตัวอย่าง
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine">
<style>
.w3-tangerine {
font-family: 'Tangerine', serif;
}
</style>
ในร่างกายของหน้าเว็บของคุณใช้ชื่อคลาส:
ตัวอย่างเพิ่มเติม
ทำเว็บ!
ทำเว็บ!
ตัวอย่าง
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Lobster&effect=brick-sign">
ลองตัวเอง» ทำเว็บ!
ตัวอย่าง
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Allerta+Stencil">
ลองตัวเอง» ผลกระทบตัวอักษรไม่ทำงานใน Internet Explorer 9 และก่อนหน้านี้ |
การเปลี่ยนหน้าตัวอักษร
ในหัวของหน้าเว็บของคุณ (หรือในแผ่นงานสไตล์ของคุณ) หลังจากที่คุณได้โหลด w3.css เปลี่ยนรูปแบบของ HTML และร่างกาย:
ตัวอย่าง
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<style>
html , body {
font-family: "Comic Sans MS", cursive, sans-serif;
}
</style>
ลองตัวเอง»