前端切图外包时，适配不同类型的页面是一个重要环节。其中，字体 family（字体族）的选择和配置对于保证页面的美观和一致性至关重要。以下是一些关键点，可以帮助您在外包切图时更好地使用 font-family 属性来适配各类页面：

1. **字体栈（Font Stack）**
- 使用字体栈可以确保在不同设备上都有合适的字体显示。字体栈通常包含多个字体名称，当首选字体不可用时，系统会尝试使用下一个字体。例如：
```css
font-family: 'Open Sans', sans-serif;
```
这意味着如果系统没有 'Open Sans' 字体，它会尝试使用 sans-serif 字体族中的其他字体。

2. **系统默认字体**
- 了解并利用不同操作系统上的默认字体是非常重要的。例如，Windows 上有 Segoe UI，Mac 上则是 San Francisco。您可以根据目标用户群的操作系统来选择字体。

3. **Web 安全字体**
- Web 安全字体是指那些被广泛认可并在大多数浏览器中都能可靠显示的字体。这些字体包括 Arial, Verdana, Georgia, Times New Roman, sans-serif, serif 等。在外包切图时，确保您的字体选择至少包含这些安全字体中的一个。

4. **自定义字体**
- 如果您想要使用特定的字体，并且该字体不是系统默认的，您可能需要使用 @font-face 规则来引入自定义字体。确保在切图外包时提供这些字体文件，并指导切图人员如何正确地使用它们。

5. **字体权重和样式**
- 除了字体家族的选择，还要考虑字体的权重（如 bold, normal, italic 等）和样式。确保在不同页面元素上使用一致的字体样式。

6. **字体大小和行高**
- 字体大小和行高对于阅读体验至关重要。确保在不同设备上字体大小和行高都是可读的，并且符合 accessibility 标准。

7. **响应式设计**
- 在移动设备和桌面设备上，字体大小可能需要根据屏幕尺寸进行调整。使用媒体查询来设置不同的 font-size 和 line-height 值，以适应不同的设备。

8. **字体许可**
- 如果使用的是第三方字体，确保您有合法的使用许可，并且在外包切图时明确告知切图人员字体的使用限制。

9. **字体测试**
- 在切图完成后，进行彻底的字体测试，确保在不同设备、不同操作系统上字体都显示正确。

10. **字体一致性**
- 确保整个网站或应用中的字体使用一致。这包括字体家族、字体权重、字体大小和行高的一致性。

通过关注这些要点，您可以更好地在外包切图时适配各类页面，确保用户体验的一致性和美观性。