在CSS网页设计中，指定字体通常使用font-family属性。这个属性允许你指定一个或多个字体名称，浏览器会按照你提供的顺序尝试加载这些字体，直到找到用户系统中已安装的字体。

以下是一些基本的用法示例：

1. 指定单一字体

css复制代码body {font-family: Arial, sans-serif;}

在这个例子中，浏览器会首先尝试使用Arial字体。如果用户系统中没有安装Arial，浏览器会回退到使用默认的sans-serif字体族。

2. 指定多个字体

css复制代码h1 {font-family: "Times New Roman", Times, serif;}

这里，浏览器会首先尝试使用"Times New Roman"字体。如果用户系统中没有安装"Times New Roman"，浏览器会尝试使用Times字体。如果Times也不可用，浏览器会使用默认的serif字体族。

3. 使用字体族（generic family）

字体族是一组具有相似设计特征的字体集合。常见的字体族有serif（衬线字体）、sans-serif（无衬线字体）、monospace（等宽字体）、cursive（手写体）和fantasy（装饰性字体）。

css复制代码p {font-family: monospace;}

在这个例子中，浏览器会使用用户系统中默认的等宽字体。

4. 使用@font-face规则加载自定义字体

如果你想要使用特定的字体，而该字体可能不在所有用户的系统中安装，你可以使用@font-face规则来加载自定义字体。

css复制代码

@font-face {

font-family: 'MyCustomFont';

src: url('mycustomfont.woff2') format('woff2'),

url('mycustomfont.woff') format('woff');

font-weight: normal;

font-style: normal;

}



body {

font-family: 'MyCustomFont', sans-serif;

}

在这个例子中，@font-face规则定义了一个名为'MyCustomFont'的自定义字体，并指定了字体文件的URL和格式。然后，在body选择器中，我们指定了使用这个自定义字体作为首选字体。

注意事项

• 确保你拥有使用自定义字体的合法权利，特别是当字体是商业字体时。
• 使用.woff2和.woff格式可以提供广泛的浏览器支持，并且这些格式通常具有较好的压缩效果。
• 字体名称（在font-family中指定的）是区分大小写的，但浏览器在解析时通常不区分大小写。然而，为了保持一致性，最好按照字体文件的实际名称来指定。
• 在指定字体时，尽量提供多个后备选项，以确保在所有用户系统中都能显示合适的字体。