字体真棒图标在 .NET/MVC 应用程序中不起作用答案

【问题标题】：Font Awesome Icon not working in .NET/MVC Application字体真棒图标在 .NET/MVC 应用程序中不起作用
【发布时间】：2019-01-03 19:59:10
【问题描述】：

正如标题所说的那样简单，但我正在努力完成这些步骤。我从 Nuget Package Manager 下载了 font-awesome 并将其添加到我的项目中。

我还在我的捆绑配置文件中添加了字体很棒的 css：

bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/site.css",
                      "~/Content/font-awesome.min.css"));

内容/CSS 加载到我的主布局页面上，所有后续页面都继承自该页面。

<meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")

但尝试使用按钮形式的图标：

<a href="@Url.Action("Edit", "Story", new { id = Model.Id })" class="btn btn-primary">
                    <i class="fas fa-adjust"></i>
                    Edit Story
</a>

结果什么都不显示。我在这些步骤中遗漏了什么？

【问题讨论】：

fas fa-adjust 请改成“fa fa-adjust”
你代码中的类是fas还是fa？
在字体真棒网站上它说但我将其更改为 fa fa-adjust 并且它有效。谢谢。
@AsifRaza 也对我有用。将 fas 更改为 fa。谢谢你。也许你应该把这个作为答案。

标签： asp.net asp.net-mvc razor font-awesome nuget-package

【解决方案1】：

需要检查的几件事：

您是否还包括了实际字体并将它们放置在您的 font-awesome.css 文件中引用的文件夹（搜索 @font-face 标签，url 属性）
您是否还加载了 javascript(fontawesome.js) 并将其包含在 ScriptBundle 中？

今天有几十个用于 font-awesome 的 NuGet 包，但我更喜欢控制，所以这是在 ASP.NET MVC 中手动安装 Font Awesome 的方法：

从官网下载font awesome zip包。
在 Content 子文件夹中创建一个文件夹，并将其命名为“font-awesome”。
将下载的 zip 包中的 css 和 webfonts 文件夹复制到步骤 2 中创建的文件夹中。
将 js 文件夹内容复制到 Scripts 文件夹中
在您的捆绑配置中，包括“~/Content/font-awesome/css/all.css”以及 “~Scripts/fontawesome.js”。
完成

【讨论】：