使用 @font-face 规则时，你需要指定字体文件的路径，并使用 font-family 属性定义字体名称。这样，你就可以通过在样式中使用这个字体名称来应用自定义字体。
下面是一个基本的 @font-face 规则的例子：
@font-face {
font-family: 'CustomFont';
src: url('path/to/custom-font.woff2') format('woff2'),
url('path/to/custom-font.woff') format('woff');
/* 可以添加更多的字体格式，如 truetype (.ttf)、opentype (.otf) */
font-weight: normal;
font-style: normal;
}
这个例子中：
- font-family: 定义字体名称，后续可以在样式中使用。
- src: 指定字体文件的路径，以及文件格式，以确保浏览器能够正确加载。在这个例子中，提供了 WOFF2 和 WOFF 格式的字体文件路径。
- font-weight 和 font-style: 分别定义字体的粗细和风格。这两个属性是可选的。
一旦定义了 @font-face 规则，你就可以在其他样式规则中使用这个自定义字体：
body {
font-family: 'CustomFont', sans-serif;
}
这样，body 元素及其子元素将使用定义的 CustomFont 字体，如果该字体不可用，则会回退到系统中的 sans-serif 字体。
转载请注明出处：http://www.pingtaimeng.com/article/detail/6074/CSS