Fontastic.me 无法在移动设备上使用
Fontastic.me not working on mobile
Fontastic.me
是一个允许您上传 svg
文件的网站,因此您可以将 icons
用作字体。我已经多次使用这个网站,但今天我注意到 mobile
上的图标不再起作用了。他们确实在 browsers
计算机上工作。今天才发现,之前一直有效
您可以使用此 link 在移动设备上进行测试。
对我来说,这似乎是 Fontastic CSS 生成器中的一个错误:您的页面 links CSS
https://fontastic.s3.amazonaws.com/8pMGtiqubDqmpbD4ER7hE3/icons.css
这包含最后一个 SVG 后备 link编辑为
https://cdn.myfontastic.com/8pMGtiqubDqmpbD4ER7hE3/fonts/1446830181.svg#1446830181
URL 的散列部分必须与 SVG 中的字体 ID 对应,但实际源包含 <font id="cloud-font" horiz-adv-x="512">
。
因此,将 #14468301
替换为 CSS 中的 #cloud-font
或替换 SVG 中的 @id 值应该可以解决您的问题。
这仅适用于您的手机确实使用 SVG 版本的情况。只有少数浏览器会这样做(我认为 Android 低于 4.4,可能是旧的 Safari、Blackberry,也可能是 Opera Mobile)。
(除此之外,您的 HTML 在 BODY 中包含带有图标 CSS link 的额外 HEAD 标记,is not valid。我认为这不会使任何理智的浏览器完全忽略 link,但不能排除这种可能性。如果您的页面是真实的 application/xhtml+xml
,浏览器应该会立即显示错误。)
格雷格,我遇到了同样的问题。我最终放弃了 Fontastic,改用 https://glyphter.com/。
Glyphter 通过一次上传每个字符来创建您自己的字体集。
它对我有用,也许你也可以试试这个,看看它是否有效。
Fontastic.me
是一个允许您上传 svg
文件的网站,因此您可以将 icons
用作字体。我已经多次使用这个网站,但今天我注意到 mobile
上的图标不再起作用了。他们确实在 browsers
计算机上工作。今天才发现,之前一直有效
您可以使用此 link 在移动设备上进行测试。
对我来说,这似乎是 Fontastic CSS 生成器中的一个错误:您的页面 links CSS
https://fontastic.s3.amazonaws.com/8pMGtiqubDqmpbD4ER7hE3/icons.css
这包含最后一个 SVG 后备 link编辑为
https://cdn.myfontastic.com/8pMGtiqubDqmpbD4ER7hE3/fonts/1446830181.svg#1446830181
URL 的散列部分必须与 SVG 中的字体 ID 对应,但实际源包含 <font id="cloud-font" horiz-adv-x="512">
。
因此,将 #14468301
替换为 CSS 中的 #cloud-font
或替换 SVG 中的 @id 值应该可以解决您的问题。
这仅适用于您的手机确实使用 SVG 版本的情况。只有少数浏览器会这样做(我认为 Android 低于 4.4,可能是旧的 Safari、Blackberry,也可能是 Opera Mobile)。
(除此之外,您的 HTML 在 BODY 中包含带有图标 CSS link 的额外 HEAD 标记,is not valid。我认为这不会使任何理智的浏览器完全忽略 link,但不能排除这种可能性。如果您的页面是真实的 application/xhtml+xml
,浏览器应该会立即显示错误。)
格雷格,我遇到了同样的问题。我最终放弃了 Fontastic,改用 https://glyphter.com/。
Glyphter 通过一次上传每个字符来创建您自己的字体集。
它对我有用,也许你也可以试试这个,看看它是否有效。