问题标签 [icomoon]

我的所有图标都可以，但没有一个图标::before为我的spanori或div.

这是我的图标不显示：

这是我正确的图标并::before为i：

大家，我在 Safari 上渲染 icomoon 图标时遇到问题，它们看起来比在 Chrome 上看起来更大胆和更大。

我试图设置font-sizeandfont-weight但这似乎不起作用

这些是我正在应用的样式，我使用的是 bootstrap 4，所以我覆盖了它们下拉列表的默认图标

这是 HTML：

以下是它们外观的一些屏幕截图：Chrome

苹果浏览器

知道会是什么吗？

我想在具有透明部分的图标字体下放置一个白色背景，以便该部分在悬停时改变颜色：

我尝试使用边界半径和剪辑路径。但仍然显示白色轮廓。甚至尝试制作更小的背景。不起作用：

我的CSS：

HTML

我正在开发一个 Web 应用程序，它使用 500 多个 SVG 图标来显示徽标、符号等。一段时间以来，我们一直在使用Icomoon 应用程序生成字体文件，使我们能够使用 CSS 类将图标插入页面。

例如，我们有这个图标，它由三个路径组成；两个用于黑色铃铛，一个用于红色圆圈：

我们从 Icomoon 应用程序中得到的结果为我们提供了一个 CSS 文件，其中包含以下内容，其中为图标生成了三个路径并分配了它们自己的颜色：

然后可以将其插入到这样的页面中：

然而，这是一个手动过程，随着 SVG 图标集合的增加，变得很麻烦，每次添加新图标时，我们都需要通过 Icomoon 生成新的字体文件。

我玩过不同的 Webpack 插件，它们通过自动生成字体文件来解决这个问题，比如webfonts-generator和fancyon。但它们似乎都没有保持开箱即用的 SVG 的颜色。由于我们的许多图标都是彩色的，它们的颜色应该自动包含在内。

我知道字体的目的是显示文本等，而颜色可能超出了他们的责任范围。但是，像我提到的那些 webpack 插件是否可以以与本示例类似的方式包含颜色，以及如何？

我在 nextjs 网站上工作，最近我添加了fontmin-webpack插件，该插件不断抛出错误fontmin/node_modules/ttf2woff2/jssrc/ttf2woff2.js:3 Invalid asm.js: Invalid member of stdlib我没有设法修复。

该网站正在使用font-family: "icomoon"; 在src/icons/style.css中定义- 我不确定这是否重要。

这是我到目前为止所做的事情：

将fontmin-webpack和file-loader添加到站点

在next.config.js中导入依赖项

我正在使用 webpack 5，并尝试升级/降级依赖项（ttf2woff2、lodash、webpack-sources、fontmin-webpack）。或者代码中的某个地方可能存在错误。

我正在尝试添加自定义图标，我按照以下教程进行操作： https ://www.reactnative.guide/12-svg-icons-using-react-native-vector-icons/12.1-creating-custom-iconset.html

我将 icomoon.tff 文件放在 ./assets/fonts 中，所以在我的 package.json 中，我添加了：

然后在我的 HomePage.js 中：

然后我跑了：

但是，它仍然显示无法识别的字体系列 Icomoon 并且屏幕显示一个问号而不是图标。

我正在为我的项目使用自定义 icomoon 图标和引导程序。我将我的图标放在 .btn .btn-primary div 中。虽然文本自然变化，但图标保持不变。我该怎么做才能让它发挥作用？我真诚地被困在这里。提前致谢。

这是示例代码：

我希望我受到按钮 css 的影响。

编辑：我找到了解决方案。不要在你的 CSS 中包含任何颜色规范，它会起作用

打开 devTools 时，google chrome 中的 icomoon 图标存在一个奇怪的问题。通过随机刷新，所有图标都变成了“”、“”、“ïŠ�”等字符。刷新后，图标恢复正常。当缓存被禁用时，一切正常。

截图：