在CSS中引用外部字体通常涉及到@font-face规则和Google Fonts等字体库的使用。这些方法能够让网页设计更具个性。
使用@font-face规则，需在CSS文件的开头定义字体。例如，可将字体文件上传到服务器，然后在CSS中书写如下代码：
```css@font-face { font-family: '自定义字体名'; src: url('字体文件路径.woff2') format('woff2'), url('字体文件路径.woff') format('woff'); font-weight: normal; font-style: normal;}```
此代码定义了一种新字体，能在需要时使用它。字体文件路径必须正确，确保它被浏览器访问到。
借助Google Fonts，可以简化外部字体的引用过程。访问Google Fonts网站，找到想要的字体，并复制提供的链接代码。链接代码通常如下：
```html```
此代码需插入HTML文档的`n 部分。接着，在CSS中引用此字体，示例如下：
```cssbody { font-family: '字体名', sans-serif;}```
在引入字体时，可能会遇到跨域问题，确保字体文件可以从相应的服务器访问。尤其关注使用绝对路径时是否存在访问限制。
选择正确的字体格式很重要，woff和woff2是推荐的选项，因其压缩效果好，加载更快。还可考虑支持的浏览器范围，这决定了选择哪种格式。
通常，为了谷歌字体的兼容性，使用display=swap可以减少加载字体时的闪烁效果。这确保字体加载的顺滑程度。
字体样式和权重在设计中也不能忽视。在引用时，通过font-weight和font-style属性来进行细致控制。
在设计时，保持网页整体风格的统一性至关重要，因此选择两到三种不同的字体进行搭配，避免过于花哨。
通过这些方法，能够灵活应用各种外部字体，丰富网页的视觉表现力，提升整体用户体验。