引入字体文件的方法

@font-face {
font-family: SketchRockwell; /*这里是说明调用来的字体名字*/
src: url(‘SketchRockwell.ttf’); /*这里是字体文件路径*/
}
.my_CSS3_class {
font-family: SketchRockwell; /*这里设置某参数的字体值,在这里是“my_CSS3_class”调用了你刚才声明的字体值"SketchRockwell"*/
font-size: 3.2em; /*这里是字体大小*/
}

 

字体后缀和浏览器有关,如下所示
* .TTF或.OTF,适用于Firefox 3.5、Safari、Opera
* .EOT,适用于Internet Explorer 4.0+
* .SVG,适用于Chrome、IPhone
比如:
@font-face {
font-family: 'HansHandItalic';
src: url('fonts/hanshand-webfont.eot');
src: url('fonts/hanshand-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/hanshand-webfont.woff') format('woff'),
url('fonts/hanshand-webfont.ttf') format('truetype'),
url('fonts/hanshand-webfont.svg#webfont34M5alKg') format('svg');
font-weight: normal;
font-style: normal;
}

posted on 2019-01-17 09:05  HelloWorld`  阅读(1718)  评论(0编辑  收藏  举报

导航