问题标签 [woff2]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
908 浏览

nginx - Nginx 和 Fontawesome v5 问题

虽然多年来以各种形式提出了这个问题,但没有一个答案对我有用,而且有效的解决方案根本没有意义。
我希望有人能够理解为什么解决方案可以解决问题,或者帮助我找出真正的问题。
问题是我们的一些 woff2 font-awesome 字体无法正确显示,如下面的输出所示

如下添加位置块似乎可以解决问题,即使位置块本身什么也不做(至少根据我的理解)

我的 mime.types 中也有以下映射

我们使用 brotli 和 gzip 进行压缩

0 投票
3 回答
625 浏览

python - 如何在 Python 中使用 fonttools 将 woff2 字体转换为 ttf?

我有 woff2 文件,我想使用 Python 和 fonttools 库将其转换为 ttf。我已经看到了一些关于如何将 ttf 字体转换为 woff2 的方法,但我不能用它们来做相反的事情。

提前致谢

0 投票
0 回答
264 浏览

windows-server-2012-r2 - Woff2 字体在 Windows Server 2012R2 上的 cefsharp 中消失了

使用 Cefsharp for Windows 窗体(所有最新版本)...

我将 Cefsharp 添加到新解决方案中,并创建了以下代码:

我使用的网址,例如有一些 Woff2 字体。他们的选择框。

如果我在 Windows 10 中运行该应用程序,我会看到下拉列表 (woff2) 很好:

在此处输入图像描述

但是,如果我在 Windows Server 2012R2 上运行代码,则会丢失图标:

在此处输入图像描述

如果我在 Windows Server 2012R2 上打开 Chrome 并打开 url,则会显示箭头。所以只有在使用 Cefsharp 时才会这样。

知道为什么在 Windows Server 2012R2 上运行的 Cefsharp 中没有显示 woff2 字体吗?

0 投票
1 回答
38 浏览

html - 最难让字体真正显示 html 文件

我在导入字体并在我的网站上实际工作时遇到问题。字体是 Microgramma,不要与谷歌免费字体 Michroma 混淆(不相关,但是是的)。我通过 letotype 购买了 .woff 和 .tff 版本的许可证。我只想更改我的 div.logo、页脚和 h1。我不知道是因为我没有导入它,还是其他一些因素。

网站为我提供了这个字体代码:

https://codepen.io/daddchamploo/pen/ZEWNvXN

0 投票
1 回答
421 浏览

fonts - 创建材质图标子集

我只使用了几个 Material Icons 图标,并认为加载整个库是一种资源浪费。

我尝试编辑原始 woff2 文件并删除所有我不使用的图标。我得到的最接近的是使用这个工具: http: //fontstore.baidu.com/static/editor/index-en.html#

但是当我导出修改后的文件时,它不像原来的那样工作。例如,此 HTML 不会呈现为图标: <span class="material-icons">check_circle</span>

我按照 Google 指南中的说明添加了所需的 CSS 规则。当我自己托管原始woff2 文件时,一切正常,但在我修改它时会中断。它仅在使用 Unicode 作为contnet. 似乎保存文件会剥离名称到图标的映射(如果有任何意义,因为我不熟悉 woff2 文件的工作方式)。

有没有办法创建一个像原始文件一样工作的 woff2 文件的子集?

0 投票
1 回答
363 浏览

css - /icons/icomoon.woff 文件 404 在 Cloudways 中找不到

我在生产中看不到 icomoon 图标,因为它返回 404 错误:

GET /icons/icomoon.woff net::ERR_ABORTED 404(未找到)

GET /icons/icomoon.woff2 net::ERR_ABORTED 404(未找到)

文件在正确的路径中:公共/图标

我在 public/icons/style.css 中有以下代码:

我试图以这种方式放置 src:

但它没有用。

我还尝试将以下代码放在 public/web.config 中:

而且它也不起作用。

0 投票
0 回答
96 浏览

css - 如何将可变字体嵌入为 base64?

我试图在我正在开发的网站中将 HTTP 请求保持在最低限度。FontSquirrelTransfonter在将 WOFF2 编码为 base64 时非常有用,但我对可变字体并保持其所有特征/轴(它们导致静态字体)没有运气。

有没有办法可以将 WOFF2 可变字体编码为 base64 并保留其所有可定制的优点?

0 投票
0 回答
68 浏览

css - WOFF webfont 生成器生成大量垃圾(可能是原始字体)数据

我的目标是设计一个简单的网站,使用自定义字体(在 Google 字体中不可用)。我使用 FontSquirrel 的 webfonts 生成器作为手动链接字体的补充。预期 WOFF 和 WOFF2 文件的 src 只是指向文件的简单链接。发生的事情是生成器为每个 WOFF 和 WOFF2 文件添加了这些垃圾数据(在 pastebin 上被当作垃圾邮件,在这里也可能被当作垃圾邮件)。这让我失望了。

正如我已经说过的,我手动链接了文件并且它不起作用,但这可能只是我不知道 webfonts 如何工作的副作用。我试图在互联网上查找有关此内容的内容,并发现了不相关的结果。

我使用 FontSquirrel 生成文件,这些是我使用的设置。额外的字体文件类型用于调试这个问题(我发现它只发生在 WOFF 上)。

我真的没有正确链接 WOFF 文件吗?WOFF应该像这样链接吗?生成器是否应该将垃圾数据插入 WOFF srcs?

编辑1:我现在才发现(在有人指出之后)这个“垃圾数据”可能只是原始字体数据。但是,我仍然不知道为什么会发生这种情况,如果这是一个错误,我可以使用指向文件的简单 src 属性,或者这是故意的?

0 投票
1 回答
55 浏览

electron - 如果您在电子应用中有 TFF,您是否需要 WOFF

我在 React 中设置了一个电子应用程序,与 web 不同,我仍然需要使用 eot | 哇 | woff2 如果我使用谷歌的 TFF。

我知道如果网络浏览器我必须将它们全部用于向后功能但不确定电子应用程序。

0 投票
0 回答
265 浏览

font-face - 图标字体 - WOFF2 在某些设备上显示正方形 ☒

我使用 IcoMoon 生成了一个 Icon webfont,然后使用 FontSquirrel 将 TTF 文件转换为 WOFF 和 WOFF2 文件。

WOFF 文件供 IE 用户使用,WOFF2 供所有其他浏览器使用。

我在 FontSquirrel 中使用了这些设置:

  • Truetype 提示:保持存在
  • 渲染:修复 GASP 表
  • 垂直指标:自动调整垂直指标
  • 修复缺失的字形:空格、连字符
  • X 高度匹配:无
  • 子集:无子集
  • 高级选项 - Em Square 值:2048;调整字形间距:0

我在我拥有的所有设备和浏览器(Windows、Linux、Android、iPhone、所有浏览器)上进行了测试,并且 WOFF2 文件运行良好。
Apache 以 响应Content-Type: font/woff2,并且没有 CORS 问题。

但是,一些用户报告说网站上的所有图标都显示为带有十字 (☒) 的正方形。
报告问题的用户正在使用:

  • Android 9 上的 Chrome v84(华为 Y6 2019)
  • Android 8 上的 Chrome v89(三星 Galaxy S7)

一旦我更改@font-face为使用 WOFF 文件,这个问题就解决了。

我也有一些谷歌字体(自托管),以类似的方式与 WOFF2 一起服务,这些字体在报告上述问题的用户的设备上运行良好。

有什么想法为什么在某些设备上自托管的 Google Fonts WOFF2 可以工作,但我生成的 Icons/Glyphs WOFF2 文件却不行?