Web Safe Fonts Reference
浏览所有网页安全字体,支持按serif、sans-serif和monospace过滤的实时预览。
Arial, Helvetica, sans-serifThe quick brown fox jumps over the lazy dog
'Arial Black', Gadget, sans-serifThe quick brown fox jumps over the lazy dog
Verdana, Geneva, sans-serifThe quick brown fox jumps over the lazy dog
Tahoma, Geneva, sans-serifThe quick brown fox jumps over the lazy dog
'Trebuchet MS', Helvetica, sans-serifThe quick brown fox jumps over the lazy dog
Impact, Charcoal, sans-serifThe quick brown fox jumps over the lazy dog
Helvetica, Arial, sans-serifThe quick brown fox jumps over the lazy dog
'Times New Roman', Times, serifThe quick brown fox jumps over the lazy dog
Georgia, serifThe quick brown fox jumps over the lazy dog
Garamond, serifThe quick brown fox jumps over the lazy dog
'Palatino Linotype', 'Book Antiqua', Palatino, serifThe quick brown fox jumps over the lazy dog
'Book Antiqua', Palatino, serifThe quick brown fox jumps over the lazy dog
'Courier New', Courier, monospaceThe quick brown fox jumps over the lazy dog
'Lucida Console', Monaco, monospaceThe quick brown fox jumps over the lazy dog
Monaco, 'Courier New', monospaceThe quick brown fox jumps over the lazy dog
| 字体名称 |
|---|
| Arial |
| Arial Black |
| Verdana |
| Tahoma |
| Trebuchet MS |
| Impact |
| Helvetica |
| Times New Roman |
| Georgia |
| Garamond |
| Palatino Linotype |
| Book Antiqua |
| Courier New |
| Lucida Console |
| Monaco |
关于此工具
网页安全字体是可以保证在所有设备和浏览器上正确显示而无需额外下载的字体，是可靠网页排版的基础。与需要增加页面加载时间并需要备用策略的自定义字体不同，网页安全字体已经安装在几乎所有计算机和操作系统上。此工具提供了按类别整理的所有网页安全字体的综合参考——衬线字体、无衬线字体和等宽字体——因此您可以快速找到设计的完美字体，而无需猜测它的呈现方式。
使用此参考很简单：通过实时预览浏览网页安全字体的完整列表，显示每种字体的确切外观，或按类别筛选以专注于传统设计的衬线字体、现代和整洁布局的无衬线字体或代码和技术内容的等宽字体。每个预览以各种大小和粗细显示字体，以便您在提交设计之前可以评估可读性和视觉影响。找到您喜欢的字体后，您可以将其CSS font-family声明直接复制到样式表中。
此工具对于希望在不使用网页字体服务复杂性的情况下构建快速、可靠网站的开发人员和设计人员至关重要。通过从网页安全字体中进行选择，您可以确保跨设备的排版一致性，减少HTTP请求，提高页面性能——同时保持专业的设计标准。
常见问题
代码实现
# Generate CSS font stacks for web-safe fonts
WEB_SAFE_FONTS = {
"serif": [
("Georgia", "Georgia, 'Times New Roman', Times, serif"),
("Times New Roman", "'Times New Roman', Times, serif"),
("Palatino", "'Palatino Linotype', 'Book Antiqua', Palatino, serif"),
("Garamond", "Garamond, serif"),
],
"sans-serif": [
("Arial", "Arial, Helvetica, sans-serif"),
("Helvetica", "Helvetica, Arial, sans-serif"),
("Verdana", "Verdana, Geneva, sans-serif"),
("Tahoma", "Tahoma, Geneva, sans-serif"),
("Trebuchet MS", "'Trebuchet MS', Helvetica, sans-serif"),
],
"monospace": [
("Courier New", "'Courier New', Courier, monospace"),
("Lucida Console", "'Lucida Console', Monaco, monospace"),
("Consolas", "Consolas, 'Courier New', monospace"),
],
}
for category, fonts in WEB_SAFE_FONTS.items():
print(f"\n{category.upper()}")
for name, stack in fonts:
print(f" {name}: font-family: {stack}")Comments & Feedback
Comments are powered by Giscus. Sign in with GitHub to leave a comment.