我想使用我从Google字体下载的OpenSans-Light.tff webfont。这是我在我的main.css中试图做的：如何使用CSS添加Opan Sans .tff？
@font-face {
font-family:"OpenSans";
src: url("fonts/OpenSans-Light.ttf");
}
.banner h1 {
font-family: "OpanSans", arial;
}
虽然它不起作用。
如果你想只使用@import这样使用它：
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
或添加到您的HTML <head>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
，然后添加到您的CSS
.banner h1{font-family: 'Open Sans', sans-serif;}
最简单的（也可以说是最好的方式）简单地使用@import在你的CSS。
这里有一个我的jsfiddle为你做的：http://jsfiddle.net/gLej4h82/
CSS：
@import url('http://fonts.googleapis.com/css?family=Open+Sans');
body {
font-family: 'Open Sans';
}
如果添加
@import URL（http://fonts.googleapis.com/css?family=Open+Sans:400,700,300）;
到你的代码在你的CSS文件中的最顶部，并引用它的某些物体，如低于它应该工作
.banner h1{
font-family:'Open Sans', sans serif;
font-weight: 400; /* 400 is regular, 300 is light, 700 is bold */
}
使用此服务生成的字体脸你它的非常好的服务。
首先，它是OPEN，而不是OPAN。其次，这不是谷歌字体提供的代码，甚至不是 – Devin 2014-09-19 03:31:41