Question

我正在尝试找到位于此处的Helvetica Neue LT Std 97 Black Condensed字体的CSS font-family名称：http://fontscore.com/fonts/Helvetica-Neue-LT-Std-97-Black-Condensed_22554.html

我正在使用@font-face将字体加载到网页上，如果用户计算机上已经没有，但是，如果首先在用户计算机上找到，我希望能够加载字体。我在这里尝试了几种方法，但这些方法都不起作用：

font-family:  HelveticaNeueLT Std Blk Cn
font-family:  HelveticaNeueLT Std ExtBlk Cn

调用font-family时我应该使用这个字体的名称是什么？我可能不得不把97放在那里，但没有任何作用，已经尝试了很多不同的方法来调用它。

这是我在CSS中使用的内容：

@font-face {
    font-family: hnc_font;
    src: local('HelveticaNeueLT Std Blk Cn'), local('HelveticaNeueLTStd-BlkCn'), url('../fonts/hnc.otf') format('opentype'), url('../fonts/hnc.woff') format('woff'), url('../fonts/hnc.ttf') format('truetype'), url('../fonts/hnc.svg') format('svg');
    font-weight: normal;
}

@font-face{ 
    font-family: MyFont_IE;
    src: url('../fonts/swiss_bc.eot'); 
}

.big_text
{
    padding-top: .4em;
    font-size: 5.5em;
    font-family: HelveticaNeueLT Std Blk Cn, HelveticaNeueLTStd-BlkCn, hnc_font, MyFont_IE;
}

Answer 1

首先通过在"引号中包装字体名称来尝试所有组合。

例如font-family: "Helvetica Neue LT Std 97 Black Condensed"

然后，您调用的名称由@font-face之前的font-family声明定义。你可以随意调用它。

例如，如果您首先将其声明为此

@font-face{
    font-family: "MY_FONT_NAME";
    src: url('PATH_TO/FONT_FILENAME.ttf');
}

你可以稍后像这样引用它

font-family: "MY_FONT_NAME";

根据添加的CSS修改

试试这个

    .big_text
{
    padding-top: .4em;
    font-size: 5.5em;
    font-family: "HelveticaNeueLT Std Blk Cn", "HelveticaNeueLTStd-BlkCn", "hnc_font", "MyFont_IE";
}

Answer 2

使用一些javascript作弊：http://jsfiddle.net/ucd2L/

var x = $("#test").css('font-family');
$("#test").append(x);

HTML

<p id="test">Text</p>

Answer 3

使用@font-face时，有两个关于字体名称的单独问题。

您在font-family规则中@font-face声明中使用的名称取决于您，只要它是一个语法上有效的字体名称，并且您在font-family中使用的名称相同普通CSS规则中的声明。所以它可以是font-family: foobar。

在local(...)规则中设置src时，@font-family构造函数中使用的名称必须与系统中已知字体的名称相匹配。它应该是您用来在font-family规则中获取本地字体而没有任何@font-face的名称，原则上它应该是PostScript名称或字体的全名，尽管浏览器可能接受其他名字也是;看到 css - machine specific font-family

font-family of a font，是什么？

3 个答案: