涉及知识
@font-face
@font-face 定义一个用于文本显示的自定义字体。详细内容可以参考 MDN文档 。
特点
- 可以自定义字体名称和与名称对应的字体文件
- 可以消除用户对电脑字体的依赖
- 可以用于字体图标的引入
用法
@font-face {
font-family: "myFont";
src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
font-stretch: "normal";
font-weight: 400;
}
属性解析
字体描述 | 值 | 说明 |
---|---|---|
font-family | name | 必需的。定义字体的名称。 |
src | URL | 必需的。定义该字体下载的网址或者文件路径 |
font-stretch | normal condensed ultra-condensed extra-condensed semi-condensed expanded semi-expanded extra-expanded ultra-expanded | 可选。定义该字体应该如何被拉长。默认值是"normal" |
font-style | normal italic oblique | 可选。定义该字体应该是怎样样式。默认值是"normal" |
font-weight |