ตระกูลชุดแบบอักษร

ใน HTML และ XHTML ได้ใช้ font face หรือ font family เป็นตัวกำหนด รูปแบบตัวอักษร

การกำหนดรูปแบบตัวอักษรในการเขียนรหัส HTML จำเป็นต้องใช้ Element Font, หรือใช้ Cascading Style Sheets (CSS). ตัวอย่างแบบ HTML ในการกำหนดตัวอักษร:

<p><font face="times, serif">Sample text.</font></p>

ตัวอย่างการใช้ CSS:

<p style="font-family: times, serif">Sample text.</p>

รูปแบบตัวอักษรนั้นจะถูกกำหนดตามรายชื่อตัวอักษรที่ปรากฏ หรือไม่ปรากฏบนคอมพิวเตอร์ แต่อย่างไรก็ตามมี 5 รูปแบบอักษรพื้นฐานที่มีใช้ในคอมพิวเตอร์ทั่วไป สามารถนำมาใช้ในทั้ง HTML และ CSS ซึ่งขึ้นอยู่กับการตั้งค่าในเบราว์เซอร์ว่าจะใช้แบบอักษรอะไรสำหรับแสดง :

Serif:	The quick brown fox jumps over the lazy dog.
Sans-serif:	The quick brown fox jumps over the lazy dog.
Cursive:	The quick brown fox jumps over the lazy dog.
Fantasy:	The quick brown fox jumps over the lazy dog.
Monospace:	The quick brown fox jumps over the lazy dog.

(ใน Windows API, มีแบบอักษร Roman, Swiss, Script, Decorative, และ Modern อยู่แล้ว).

อย่างไรก็ตาม คุณไม่สามารถคาดเดาได้ว่าแบบอักษรบนเครื่องคุณ จะมีอยู่บนเครื่องคนอื่นๆ ด้วย หรือบางทีมันอาจแสดงต่างออกไป ลองดูตารางด้านล่าง ว่าเบราว์เซอร์ของคุณแสดงผลออกมาเป็นเช่นไร:

Times:	The quick brown fox jumps over the lazy dog.
Roman:	The quick brown fox jumps over the lazy dog.
Garamond:	The quick brown fox jumps over the lazy dog.
Palatino:	The quick brown fox jumps over the lazy dog.
Antiqua:	The quick brown fox jumps over the lazy dog.
Minion:	The quick brown fox jumps over the lazy dog.
Helvetica:	The quick brown fox jumps over the lazy dog.
Swiss:	The quick brown fox jumps over the lazy dog.
Impact:	The quick brown fox jumps over the lazy dog.
Script:	The quick brown fox jumps over the lazy dog.
Decorative:	The quick brown fox jumps over the lazy dog.
Blackletter:	The quick brown fox jumps over the lazy dog.
Fraktur:	The quick brown fox jumps ov er the lazy dog.
Modern:	The quick brown fox jumps over the lazy dog.
Courier:	The quick brown fox jumps over the lazy dog.