么是Web安全字体

网络安全字体是由许多操作系统预先安装的字体。虽然不是所有的系统都安装了相同的字体，但你可以使用网络安全字体堆栈来选择几种看起来类似的字体，并且安装在你想支持的各种系统上。如果你想使用预装字体以外的字体，从CSS3开始，你可以使用网络字体Web fonts - Learn web development | MDN。

Web safe fonts are fonts that are pre-installed by many operating systems. While not all systems have the same fonts installed, you can use a web safe font stack to choose several fonts that look similar, and are installed on the various systems that you want to support. If you want to use fonts other than ones pre-installed, as of CSS3, you can use Web Fonts.

• 英文Web安全字体合集 CSS Font Stack: Web Safe and Web Font Family with HTML and CSS code.

没有网页安全中文字体

相比通常只有几十 KB 的英文字体，网页加载一个 GB2312 的中文字体至少要增加 2 MB 以上加载量，而大部分中文字体都在 5 MB 以上。所以网络字体在国内没有流行起来，还是要像英文网页好多年前一样，用网页安全字体。

下表可以看到各系统预置的中文字体——各系统根本没有相同的字体，即没有网页安全中文字体！

什么是网络字体

与网络安全字体不同，网络字体没有预先安装在用户的系统中。这些字体是由用户的浏览器在渲染网页时下载的，然后应用于你的文本。使用网络字体的主要缺点是它会减慢你网站的加载时间。在旧的浏览器中，对CSS3的支持也很有限，而使用网络字体是需要CSS3的。后面的限制可以通过使用字体堆栈来弥补，类似于网络安全字体堆栈，但包括一个网络字体作为堆栈的第一个字体。如果浏览器无法使用网络字体，它就会退回到堆栈中的网络安全字体。

Unlike web safe fonts, web fonts are not pre-installed on the user's system. The fonts are downloaded by the user's browser while rendering the webpage, and then applied to your text. The main drawbacks of using web fonts is it will slow your site's load time. There is also limited support for CSS3 in older browsers which is required to use web fonts. The later limitation can be remedied by using a font stack, similar to the web safe font stacks, but including a web font as the first font of the stack. If a browser is unable to use the web font it will fall back on the web safe fonts in the stack.

Web 字体是一种 CSS 特性，允许我们指定在访问时随您的网站一起下载的字体文件，这意味着任何支持 Web 字体的浏览器都可以使用指定的字体。所需的语法如下所示：

首先，在 CSS 的开始处有一个@font-face块，它指定要下载的字体文件：

@font-face {
  font-family: "myFont";
  src: url("myFont.ttf");
}

在这个下面，你可以使用 @font-face 中指定的字体种类名称来将你的定制字体应用到你喜欢的任何东西上，比如说：

html {
  font-family: "myFont", "Bitstream Vera Serif", serif;
}

关于网页字体有两件重要的事情要注意：

1. 浏览器支持不同的字体格式，因此需要多种字体格式以获得良好的跨浏览器支持。例如，大多数现代浏览器都支持 WOFF / WOFF2(Web Open Font Format versions 1 and 2，Web 开放字体格式版本 1 和 2)，它是最有效的格式，但是旧版本 IE 只支持 EOT (Embedded Open Type，嵌入式开放类型) 的字体，你可能需要包括一个 SVG 版本的字体支持旧版本的 iPhone 和 Android 浏览器。
2. 字体一般都不能自由使用。我们必须为他们付费，或者遵循其他许可条件，比如在代码中 (或者在站点上) 提供字体创建者标识。你不应该在没有适当的授权的情况下偷窃字体。

字体类型 - 常见字体族

serif 衬线字体族

serif 是一种具有装饰性小横线的字体族，这些小横线被称为“衬线”。Serif 字体通常被用于印刷材料中，如书籍、杂志、报纸等，因为它们的衬线可以增强字体的可读性和易读性。常见的 Serif 字体包括 Times New Roman、Georgia、和 Garamond。

sans-serif 无衬线字体族

sans-serif 是一种不带装饰性小横线的字体族。这种字体通常被用于数字屏幕上，如电脑、手机和电视。与 Serif 字体相比，Sans-serif 字体看起来更现代、更简洁。常见的 Sans-serif 字体包括 Arial、Helvetica 和 Verdana。

monospace 等宽字体族

monospace 是一种字母宽度相等的字体族，每个字符都占据相同的宽度。Monospace 字体通常用于计算机编程、打印机输出和其他需要对齐文本的应用程序。常见的 Monospace 字体包括 Courier、Consolas 和 Monaco。

cursive 手写字体族

cursive 是一种仿效手写的字体族，具有曲线、流畅的线条。这种字体通常被用于设计师、艺术家和文具爱好者等需要体现个性和艺术感的场合。常见的 Cursive 字体包括 Brush Script、Lucida Calligraphy 和 Comic Sans。

fantasy 梦幻字体族

fantasy 是一种具有艺术性和独特性的字体族，经常用于海报、书籍封面和广告等场合。这种字体的外形往往是有趣、古怪、奇特或装饰性的，常常包含有装饰性的花纹或图案。常见的 Fantasy 字体包括 Harrington、Viner Hand ITC 和 Zapfino。

Script 手写字体族

Script 字体族是一类字体，通常被设计用于模拟手写或手绘效果，以及营造一种自然、随意的艺术氛围。这类字体通常具有不规则的笔画、流畅的曲线和变化多端的字母间距，使得文本看起来像是手写而非打印。Script 字体族的应用领域非常广泛，例如印刷品设计、标志设计、广告设计等。常见的 Script 字体有 Brush Script、Lobster、Pacifico、Vibur 等。

总结

为了确保中文字符在不同计算机和浏览器上的正确显示，网页设计or开发者可以考虑：

1. 使用 Web 服务商提供的字体库：像 Google Fonts、Adobe Fonts 等服务商提供了很多中英文字体库，这些字体可以被网页直接引用，无需用户安装字体即可正常显示。
2. 使用图像或矢量图形：将中文字符转换为图像或矢量图形，并将其嵌入到网页中。虽然这种方法可以确保字符在不同浏览器和计算机上的正确显示，但其缺点是无法进行文本搜索和复制粘贴等操作。
3. 引用多个字体：如果设计者希望在网页中使用多种中文字体，可以在 CSS 样式表中指定多个备选字体。例如：font-family: "宋体", "SimSun", "Microsoft YaHei", "微软雅黑", sans-serif;

需要注意的是，尽管某些字体在设计中看起来很不错，但并不一定适合用作 Web 安全字体。设计or开发者需要权衡字体的外观和可用性，选择最适合自己需求的中文 Web 安全字体。

参考

• Web fonts - Learn web development | MDN
• CSS Font Stack: Web Safe and Web Font Family with HTML and CSS code.
• 中文网页字体设置 | inDev. Journal
• serif，sans-serif，monospace，cursive和fantasy - 腾讯云开发者社区-腾讯云

好，我是PPT模板专家——小皮老师。

我已经在头条累计分享——超过1500套漂亮的PPT模板，有需要PPT模板，找我就对了！

私信回复：下载。点击我的头像，即可看到“私信”的按钮。

前面几期，我们分享了针对PPT新手的几篇文章。

PPT新手掌握这5个技巧！做PPT简直有如神助，附工具下载

PPT新手最常见3大错误！现在看还能挽救一下

PPT新手常犯这7个错误，你有吗？附对比图

还没看过的小伙伴们可以点击链接查看！

那么，今天小皮老师跟大家分享的是中国风字体。

你看，近些年来，越来越多国潮崛起了！比如说故宫和百雀羚等等。

中国风的设计也越来越受到关注！将中国风字体运用到设计当中，不仅可以增加设计的文化韵味，还可以提现出咱们民族的设计性。

今天，小皮老师就给大家推荐一波非常好看的中国风字体，从上百款中国风字体里面挑选出来的，真的太美了。

希望大家能够喜欢，记得点赞关注评论一波哦~感谢大家！

话不多说，开始介绍：

第1款：汉仪秦川飞影W

一款带有古典气息的汉仪字体，外形和手书体有点像，线条张扬肆意，富有动势

第2款：方正清刻本悦宋

这是方正字体库的经典简体字体，这款字体字形非常美观,字体端正

第3款：王羲之书法字体

大书法家王羲之的一款中文字体，王羲之的字非常好看，具有笔力雄劲，入木三分的特点

第4款：苏新诗柳楷简

一款非常好用的方正字体，字体棱角分明，非常的霸气和美观，外加上楷体，看着非常的舒服

第5款：魚石行書

是一款很有个性的中文字体,字体输写高低不一,很有设计感

第6款：日文毛笔

一款非常漂亮的毛笔书法字体，这款字体极具力量却不失美感的字体形式

第7款：潮字社凌渡鲲鹏字体

一款非常独特的字体，第一眼看上去就非常的大气美观，笔画看上去非常的连贯流畅

第8款：康熙字典書寫體

字体笔锋犀利，热情奔放，非常好看。

第9款：腾祥伯当行楷简

融合了楷体、行书的新型字体，字形十分优美，笔锋细腻

第10款：苏新诗爨宝子简

一款出自苏新诗之手的碑帖字体

10款最美中国风字体，更新完毕！喜欢吗？

希望越来越多的朋友，都能够关注中文字体的设计！咱们一起为为中国文化的全新探索一起努力！

再次感谢这些优秀的字体设计师和字体设计公司

注：字体如果要商用，请购买版权哦。

OK，以上就是今天我们分享的内容了！

私信回复关键词：字体！ 即可获得上面10款字体的打包下载的地址。

觉得有点收获的话，可以帮小皮老师，点赞，评论转发一下！

欢迎大家留言评论。

ont 属性可以用来作为 font-style, font-variant, font-weight, font-size, line-height 和 font-family 属性的简写，或将元素的字体设置为系统字体。

字体修改

• font-family 属性：设置HTML页面中的字体
• font-size 属性：设置字体大小
• font-weight 属性：设置字体的粗细程度
• font-style 属性：设置指定字体样式

font-family写法示例：

 <style>
         p{
             font-family: "幼圆";
         }
     </style>
 </head>
 <body>
     <p>19级启嘉班</p>
 </body>

效果：