使用谷歌的Web字体本地

我的主题有以下代码：使用谷歌的Web字体本地

@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,300italic,400italic");

此字体不那么我下载了一个支持土耳其字符支持土耳其字符。但是，主题在显示大胆强壮的字体方面存在问题。

我想这个代码，但没有奏效：

@font-face { 
     font-family: '../fonts/SourceSansPro-Bold'; 
     src: url('../fonts/SourceSansPro-Bold.eot'); /* IE9 Compat Modes */ 
     src: url('../fonts/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
      url('../fonts/SourceSansPro-Bold.woff') format('woff'), /* Modern Browsers */ 
      url('../fonts/SourceSansPro-Bold.ttf') format('truetype'), /* Safari, Android, iOS */ 
      url('../fonts/SourceSansPro-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */ 

    font-weight: bold; 
    font-style: normal; 
}

我如何可以显示使用我的主题，大胆和强有力的标签？

来源

2014-09-30 nikel

没有理由使用'字体重量：大胆;'因为这已经是一个大胆的字体。此外，font-family应该只是字体的名称，而不是文件路径。 IE'font-family：'SourceSansPro-Bold';' – APAD1 2014-09-30 21:33:52

谢谢你的回答。我试过这个：http://sudrap.org/paste/text/388527/，但所有的文本都变成了大胆的 – nikel 2014-09-30 21:42:31

所有使用该字体系列的文本都将变得粗体，因为它是粗体字体。如果您需要常规版本的字体，则必须单独定义该字体。 – APAD1 2014-09-30 21:43:25

基于把你最新的更新，这里是你会怎么做：

@charset "utf-8"; 
@import url(font-awesome.min.css); 
@font-face { 
    font-family: 'SourceSansPro-Regular'; 
    src: url('../fonts/SourceSansPro-Regular.eot'); /* IE9 Compat Modes */ 
    src: url('../fonts/SourceSansPro-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('../fonts/SourceSansPro-Regular.woff') format('woff'), /* Modern Browsers */ 
     url('../fonts/SourceSansPro-Regular.ttf') format('truetype'), /* Safari, Android, iOS */ 
     url('../fonts/SourceSansPro-Regular.svg#svgFontName') format('svg'); /* Legacy iOS */ 
} 

@font-face { 
    font-family: 'SourceSansPro-Black'; 
    src: url('../fonts/SourceSansPro-Black.eot'); /* IE9 Compat Modes */ 
    src: url('../fonts/SourceSansPro-Black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('../fonts/SourceSansPro-Black.woff') format('woff'), /* Modern Browsers */ 
     url('../fonts/SourceSansPro-Black.ttf') format('truetype'), /* Safari, Android, iOS */ 
     url('../fonts/SourceSansPro-Black.svg#svgFontName') format('svg'); /* Legacy iOS */ 
} 

@font-face { 
    font-family: 'SourceSansPro-Bold'; 
    src: url('../fonts/SourceSansPro-Bold.eot'); /* IE9 Compat Modes */ 
    src: url('../fonts/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('../fonts/SourceSansPro-Bold.woff') format('woff'), /* Modern Browsers */ 
     url('../fonts/SourceSansPro-Bold.ttf') format('truetype'), /* Safari, Android, iOS */ 
     url('../fonts/SourceSansPro-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */ 
}

然后让我们说你想要的H1是大胆和P标签是正规的CSS是这样的：

h1 { font-family: 'SourceSansPro-Bold'; } 
p { font-family: 'SourceSansPro-Regular'; }

来源

2014-09-30 21:51:52 APAD1

＆subset = latin-ext for google字体效果更好。不管怎么说，还是要谢谢你。 – nikel 2014-09-30 22:52:02

尝试：

@font-face { 
     font-family: 'Source Sans Pro'; 
     src: url('../fonts/SourceSansPro-Bold.eot'); /* IE9 Compat Modes */ 
     src: url('../fonts/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
      url('../fonts/SourceSansPro-Bold.woff') format('woff'), /* Modern Browsers */ 
      url('../fonts/SourceSansPro-Bold.ttf') format('truetype'), /* Safari, Android, iOS */ 
      url('../fonts/SourceSansPro-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */ 

    font-weight: bold; 
    font-style: normal; 
}

通知的字体系列的名称。该名称应与Google Fonts中的名称相匹配。

Here's an article about it

来源

2014-09-30 21:53:32 coopersita

感谢您的答案，我upvoted它，两个答案都很好。我必须为h1s按钮找到合适的字体strongs，因为我的主题不使用粗体属性，它使用数字。 – nikel 2014-09-30 22:22:15

使用谷歌的Web字体本地

回答

相关问题