标签: webfonts

我想知道，为什么我的六个网络字体文件中只有两个被加载。

这是我的 CSS：

@font-face {
  font-family: 'Constructa';
  src: url(/content/themes/blog-theme/fonts/Constructa-Regular.woff);
}
@font-face {
  font-family: 'TranSerif HdlUltrabold';
  src: url(/content/themes/blog-theme/fonts/TranSerif-HdlUltrabold.woff);
}
@font-face {
  font-family: 'AvantGarde Bold';
  src: url(/content/themes/blog-theme/fonts/AvantGarBol.woff);
}
@font-face {
  font-family: 'ChronicleTextG3';
  src: url(/content/themes/blog-theme/fonts/ChronicleTextG3.woff);
}
@font-face {
  font-family: 'Antenna Bold';
  src: url(/content/themes/blog-theme/fonts/Antenna-Bold.otf);
}
@font-face {
  font-family: 'Antenna Thin';
  src: url(/content/themes/blog-theme/fonts/Antenna-Thin.otf);
}

Google Chrome 中的“网络”选项卡不显示任何 404。它也不显示我的字体文件正在加载。

我在其他浏览器中遇到了同样的问题，所以我建议，是我的代码造成了问题。

有什么建议？

最好的问候，本尼迪克特

PS：当然，我确实检查了其他网络字体的可用性。它们存在于给定的路径上。就是没加载。

我的网站有一个 .ttf 文件，但该文件在同一文件中具有常规和粗体。

如何使用 CSS 在 .ttf 文件中选择常规或粗体？目前我在 CSS 文件中以这种方式管理字体：

@font-face {
  font-family: Bangla MN;
  src: url("../fonts/Bangla MN.ttf");
}

或者有没有办法将 .ttf 文件中的常规和粗体分离为两个文件 .ttf？

提前致谢

我在Windows 7上使用Firefox 7.0.1,然后我去了一个使用奇怪字体的网页.我发现它不是图像 - 我可以选择文本.我在网站的CSS文档上找到了字体名称,并确保我的计算机上没有安装此字体.我想知道,当一个页面显示它使用浏览器所在的计算机上没有的某种字体时,浏览器是否会从Web服务器下载该字体文件的副本,仅供浏览器的渲染器使用？

如果是这样的话,当我在使用该字体的页面上时,它在我的计算机上的位置(暂时,我猜),它们是如何制作的,所以它只能用于该页面而不能复制到我的字体目录在我的系统上？

我试图使文本更薄,我已经看到它在网站上正常工作. http://www.freshthemes.net/demo/backbone/about-us/(下company overview)

这是我使用的风格:

.intro p{
    text-align: justify;
    margin-bottom: 8px;
    line-height: 22px;
    margin-bottom: 8px;
    font: 17px/21px "Open Sans", Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, sans-serif;
    font-style: normal;
    font-variant: normal;
    font-weight: 300;
    color:#656565;
}

并且字体加载有:

<link rel='stylesheet' id='google_webfont_OpenSans-css'  href='http://fonts.googleapis.com/css?family=Open+Sans' type='text/css' media='all' />

事情,font-weight财产似乎没有任何影响.它不介意我是否设置为300.(它不应该,在以前的网站上工作)

这是我的身体:

<div class="intro">
    <p>
        This is the text that should be thinner
    </p>
</div>

我错过了什么？

为什么即使我的网站 CSS 相同，Lato 字体在同一台计算机上的 Chrome (MacOSX) 上呈现的字重却比 Safari 上的字重稍重？

我试图在我的Vue应用程序（使用Vue cli Webpack模板创建）的某个组件中导入Web字体。在我的一个组件中，我尝试通过引用具有以下内容的项目中的_fonts.scss来导入字体：

@font-face {
  font-family: 'SomeFont';
  src: url('~/assets/fonts/SomeFont-Regular.woff2') format('woff2'),
  url('~/assets/fonts/SomeFont-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

然后，当我打开应用程序时，出现以下错误：

Failed to decode downloaded font: http://localhost:8080/assets/fonts/SomeFont-Regular.woff2
Failed to decode downloaded font: http://localhost:8080/assets/fonts/SomeFont-Regular.woff

与此也：

OTS parsing error: invalid version tag
OTS parsing error: invalid version tag

我在网上搜索了此问题，却一无所获，或遇到了一些相关情况

我的主要目标是删除未使用的字体（字体链接）。我必须知道网站上实际使用的所有字体系列，然后我将删除所有未使用的字体。答对了 ;）

我想提取整个Google Web字体集合的提要,并将它们收集到具有此结构的数组中(font collection => font name):

<?php
$googleFonts = array
(
"" => "None",
"Abel"=>"Abel",
"Abril Fatface"=>"Abril Fatface",
"Aclonica"=>"Aclonica",
"Actor"=>"Actor",
"Astloch:regular,bold"=>"Astloch (plus bold)",
//...etc
)
?>

是否存在以这种方式获取字体的API？