# font-face 小记

## 简单对比

| Type                 | Ext  | Desc                                                |
| -------------------- | ---- | --------------------------------------------------- |
| True Type Font       | ttf  | 苹果和微软共同开发。体积较大。应用范围广                                |
| Open Type Font       | otf  | Adobe和微软共同开发。由ISO组织制定了Open Font Format (off) 标准     |
| Embedded OpenType    | eot  | 对otf的压缩，但是比ttf文件更大。设计初衷是为了适应移动端                     |
| Web Open Font Format | woff | Mozilla基金会，Opera Software以及微软主导。体积小，12年开始成为w3c推荐标准。 |

## 兼容性

### [TTF/OTF](https://caniuse.com/#search=ttf)

多数浏览器都支持。早期的安卓（2.1）和ios（3.2/4.1）不支持。

IE支持度不佳。

![](https://2757623353-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LQcTxgqTqhC05ckLpLr%2F-LQcULtcaTh9ZyE1-O5p%2F-LQcUN0L6eF_UmRFpfVP%2F2018-08-29-17-35-52.png?generation=1541498837579266\&alt=media)

### [EOT](https://caniuse.com/#search=eot)

目前只有IE支持，可以兼容到IE6，edge都不支持。

对于eot的话，没有特殊要求就可以放弃治疗了。

![](https://2757623353-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LQcTxgqTqhC05ckLpLr%2F-LQcULtcaTh9ZyE1-O5p%2F-LQcUN0NcfdHi9rFyvck%2F2018-08-29-17-36-10.png?generation=1541498841725098\&alt=media)

### [WOFF](https://caniuse.com/#search=woff)

与TTF/OTF相比，桌面端的兼容性差不多。

低版本安卓和ios兼容情况较差。

![](https://2757623353-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LQcTxgqTqhC05ckLpLr%2F-LQcULtcaTh9ZyE1-O5p%2F-LQcUN0PYwtMYNtXNXaK%2F2018-08-29-17-44-17.png?generation=1541498837473841\&alt=media)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://coolconan.gitbook.io/roadmap/front-end/web-standard/css/180829-font-face.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.