Question

我有一些奇怪的问题需要解决。

首先，让我在CSS文件中显示我的@ font-face声明。

@font-face {
font-family: "Conv_Gotham-Book";
src: url("fonts/Gotham-Book.eot");
src: local("☺"), 
    url("fonts/Gotham-Book.woff") format("woff"), 
    url("fonts/Gotham-Book.ttf") format("truetype"), 
    url("fonts/Gotham-Book.svg#Gotham-Book") format("svg");
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: "Conv_Gotham-Light";
src: url("fonts/Gotham-Light.eot");
src: local("☺"),
    url("fonts/Gotham-Light.woff") format("woff"), 
    url("fonts/Gotham-Light.ttf") format("truetype"), 
    url("fonts/Gotham-Light.svg#Gotham-Light") format("svg");
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: "Conv_Gotham-Medium";
src: url("fonts/Gotham-Medium.eot");
src: local("☺"), 
    url("fonts/Gotham-Medium.woff") format("woff"), 
    url("fonts/Gotham-Medium.ttf") format("truetype"), 
    url("fonts/Gotham-Medium.svg#Gotham-Medium") format("svg");
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: "Conv_Gotham-Bold";
src: url("fonts/Gotham-Bold.eot") format("eot");
src: local("☺"),
    url("fonts/Gotham-Bold.woff") format("woff"), 
    url("fonts/Gotham-Bold.ttf") format("truetype"), 
    url("fonts/Gotham-Bold.svg#GothamBold") format("svg");
font-weight: normal;
font-style: normal;
}

问题：使用任何这些自定义字体的超链接不能仅在一个浏览器/平台组合Firefox 13.0.1 / Mac（此处示例：标题上的http://lonely-dev.com/leapfrogbeta/?page_id=896）中工作，

第二个问题：iPad2 / Safari浏览器上的字体消失。

其他一切都很好，会喜欢一些见解。

Answer 1

您已声明在.custom .headline_area h2 a中custom.css的css中使用了名为“Journal”的字体，而在上面的代码示例中，您要求使用Gotham系列（顺便说一句，没有目前的网络许可证）。在Firefox / Mac和iPad / Safari中正确加载日记。链接在两者中都有效。

更新：在所有提到的情况下，字体加载正常，但链接不起作用。这是因为a是内联元素。此外，声明标题a的高度是个坏主意。只需使用此规则：

.custom .headline_area h2 a {
  display: block;
}

并且链接将起作用。

另一件事是你应该在h1，h2等上声明标题字体，而不仅仅是在它们包含的链接上。

Firefox / Mac＆amp; amp;中的@ font-face问题iPad的

1 个答案: