font-awesome 相关问题

我正在开发 ASP.NET CORE MVC 应用程序，但在加载很棒的字体图标时遇到问题。文件夹布局如下：这是我的 _layout.cshtml 的样子：我正在开发 ASP.NET CORE MVC 应用程序，但在加载很棒的字体图标时遇到问题。这是文件夹布局：这是我的 _layout.cshtml 的样子： <environment include="Development"> <script src="~/lib/jquery/dist/jquery.js"></script> <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.js"></script> <link rel="stylesheet" href="~/lib/font-awesome/css/fontawesome.css" /> </environment> <environment exclude="Development"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" asp-fallback-src="~/lib/jquery/dist/jquery.min.js" asp-fallback-test="window.jQuery" crossorigin="anonymous" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="> </script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js" asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal" crossorigin="anonymous" integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o"> </script> <link rel="stylesheet" href="~/lib/font-awesome/css/fontawesome.min.css" /> </environment> <script src="~/js/site.js" asp-append-version="true"></script> @RenderSection("Scripts", required: false) 这是我尝试使用 fontawesome 图标的方法： <span class='input-group date datepicker'> @Html.TextBoxFor(m => m.CandidateDetail.DateOfBirth, new { @id = "DateOfBirth", @class = "form-control" }) <span class="input-group-append"> <span class="input-group-text"><i class="fas fa-calendar"></i></span> </span> </span> 当我启动该项目时，我看到的只是一个正方形。我在这里做错了什么吗？要引用 font-awesome，您应该添加 ~/lib/font-awesome/css/all.css 而不是 ~/lib/font-awesome/css/fontawesome.css。将以下代码添加到 <environment include="Development"> <environment include="Development"> <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" /> <link href="~/lib/font-awesome/css/all.css" rel="stylesheet" /> </environment> 检查 Chrome 开发者工具上的控制台+网络选项卡 (f12) 如果您在本地 IIS 上托管应用程序，则大多数情况下 IIS 默认情况下不允许 mime 类型 .woff。您可以使用 web.config 添加 mime 类型 <system.webServer> <staticContent> <remove fileExtension=".woff2" /> <mimeMap fileExtension=".woff2" mimeType="font/woff2" /> </staticContent> </system.webServer> 另一个原因是 CSS 文件和字体文件之间的相对路径不匹配。因为您使用的是 FontAwesome 提供的相同目录结构，所以我不我想这就是问题所在。就我而言，我的 App MVC ASP.net 4.8 中的捆绑包中有 css 文件： bundles.Add(new StyleBundle("~/Content/css").Include( "~/css/sb-admin-2.min.css", "~/vendor/fontawesome-free/css/all.min.css", "~/vendor/datatables/dataTables.bootstrap4.min.css", "~/Content/jquery-ui.css", "~/Content/font/bootstrap-icons.min.css" )); 在我当地的环境中，它有效；但是，它在 Azure Web 应用程序中不起作用。为了解决这个问题，我决定将其从捆绑部分中删除，并将其直接添加到我的 _layout.cshtml 中的 HEAD 部分。 <head> @Styles.Render("~/Content/css") <link rel="stylesheet" href="~/vendor/fontawesome-free/css/all.min.css"> </head>

asp.net-core asp.net-core-mvc font-awesome

回答 3 投票 0

如何在 VScode 中为 Fontawesmome 库添加 vmArgs

我正在使用 VScode 和场景生成器开发 javafx 项目，我使用 fontawesome-8.2.jar 添加图标。当我尝试运行代码时，它给了我一个错误，如果我删除了 fontawesome 我...

java visual-studio visual-studio-code javafx font-awesome

回答 1 投票 0

Webpack 导入 font-awesome 库时出现问题

我正在构建一个 React 应用程序，需要导入字体很棒的 CSS，但我收到一条错误消息，指出该模块无法解析 woff2 文件。下面是我的代码：从 '

javascript css reactjs webpack font-awesome

回答 3 投票 0

悬停在字体真棒图标时改变颜色？

在 Font Awesome 文档的基础上，我创建了这个图标：基于 Font Awesome 文档我创建了这个图标： <span class="fa-stack fa-5x"> <i class="fa fa-circle fa-stack-2x"></i> <i class="fa fa-flag fa-stack-1x fa-inverse"></i> </span> 此代码创建此 html： <span class="fa-stack fa-5x"> <i class="fa fa-circle fa-stack-2x">::before</i> <i class="fa fa-flag fa-stack-1x fa-inverse">::before</i> </span> 它是一个堆叠的旗帜图标。我想更改悬停事件上的图标颜色，我尝试了所有这些： .fa-stack:hover{ color: red } .fa-stack i:hover{ color: red } .fa-stack i before:hover{ color: red } 但不工作。如果您只想更改 hover 上旗帜的颜色，请使用： http://jsfiddle.net/uvamhedx/ .fa-flag:hover { color: red; } <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/> <i class="fa fa-flag fa-3x"></i> 使用 - !重要 - 覆盖默认黑色 .fa-heart:hover{ color:red !important; } .fa-heart-o:hover{ color:red !important; } <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <i class="fa fa-heart fa-2x"></i> <i class="fa fa-heart-o fa-2x"></i> 您唯一需要做的就是这个，例如： HTML： <span class="close_form"> <i class="fa fa-circle"></i> </span> CSS： .fa-circle { color: #d7d7d710; transition: 500ms; } .close_form:hover .fa-circle { color: #43434379; transition: 500ms; }

font-awesome font-awesome-4

回答 3 投票 0

向 SharpDX.DirectWrite.Factory 添加嵌入字体资源

我的 dll 由 .Net Framework 4.8 WPF 应用程序加载。它包括作为 .ttf 和 .otf 格式的嵌入资源的字体文件，我想将该字体以一种或另一种格式添加到 SharpDX 中。

fonts font-awesome sharpdx directwrite ninjatrader

回答 1 投票 0

WooCommerce 数量减号和加号图标未显示

我在 WooCommerce 产品页面上显示 + 和 - 数量图标时遇到一些问题。经过大量研究后，我发现出于某种奇怪的原因，WordPress 将类名赋予了

php jquery woocommerce icons font-awesome

回答 1 投票 0

Woocommerce WL：添加到购物车元素不显示 +/- 图标

大家早上好！我在 WooCommerce 产品页面上显示 + 和 - 购物车图标时遇到问题。经过大量研究后，我发现由于某种奇怪的原因 WordPress 给出了 c...