波旁威士忌@字体-面型混合 [英] Bourbon's @font-face mixin
本文介绍了波旁威士忌@字体-面型混合的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我是Bourbon&;Sass新手,正在尝试使用@font-face mixin将我下载的字体(Museo Sans)添加到我的Rails 3应用程序中。
Bourbon提供以下示例:
@include font-face(SourceSansPro, '/fonts/Source_Sans_Pro/SourceSansPro-Regular');
@include font-face(SourceSansPro, '/fonts/Source_Sans_Pro/SourceSansPro-Bold', bold);
@include font-face(SourceSansPro, '/fonts/Source_Sans_Pro/SourceSansPro-Italic', normal, italic);
// Rails asset-pipeline - place fonts in app/assets/fonts/
@include font-face(SourceSansPro, 'Source_Sans_Pro/SourceSansPro-Regular', normal, $asset-pipeline: true);
我做了什么:
// application.css.scss
@import "bourbon";
@import "fonts";
// fonts.css.scss
@include font-face(MuseoSans, '/fonts/MuseoSans/MuseoSans_500-webfont', normal, $asset-pipeline: true);
* {
font-family: MuseoSans;
}
字体位于Assets/Fonts/MuseoSans/中,文件名类似于MuseoSans_500-webfont.eot、.ttf等。我的感觉是您可以省略扩展名,而Bourbon应该拾取所有文件。
我已经尝试了上面的许多不同的变体,但都没有效果。我知道Bourbon和文件工作正常,因为当我将字体系列设置为$Helvetica时,我在页面上看到了变化。
如果有人能提供适当的代码或GitHub项目供我参考,我将不胜感激。
推荐答案
尝试删除路径中的前导"/Fonts",如:
@include font-face(MuseoSans, 'MuseoSans/MuseoSans_500-webfont', normal, $asset-pipeline: true);
这篇关于波旁威士忌@字体-面型混合的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文