CSS下载的字体怎么覆盖呢?@font-face { font-family: 'MyFont'; src: url('myfont.eot'); src: u
CSS下载的字体怎么覆盖呢?
@font-face { font-family: 'MyFont'; src: url('myfont.eot'); src: url('myfont.eot?#iefix') format('embedded-opentype'), url('myfont.woff2') format('woff2'), url('myfont.woff') format('woff'), url('myfont.ttf') format('truetype'), url('myfont.svg#svgfontname') format('svg'); font-weight: normal; font-style: normal; } body { font-family: 'MyFont', Arial, sans-serif; }
步骤解析:
1. 在CSS文件中使用@font-face
规则定义字体,其中font-family
为定义的字体名称,src
为字体文件的链接地址。
2. 在src
中按字体文件格式的支持程度降序排列字体文件链接地址,最后一个链接地址为“SVG”格式字体文件链接。
注:为了在IE6-8浏览器中不出错,需要在eot链接后添加一个“#iefix”参数。
3. 确认font-weight
和font-style
是否正确设置成了字体文件提供的相应属性。
4. 正确引入字体:将定义的字体名称写入选择器的font-family
属性中,如果字体文件链接有问题,指定的字体无法正常显示,页面会回退到备选字体如Arial等。
总之,按照这些步骤正确引入自定义字体,就可以改变Web页面的字体风格了。希望这篇文章对你有所帮助!
粉丝
0
关注
0
收藏
0