来自 Nuget 包的 Font Awesome 和来自 BundleConfig.cs 的参考
Posted
技术标签:
【中文标题】来自 Nuget 包的 Font Awesome 和来自 BundleConfig.cs 的参考【英文标题】:Font Awesome from Nuget package and reference from BundleConfig.cs 【发布时间】:2019-09-02 10:00:32 【问题描述】:我在 VS2015 v4.7.0 中从 NuGet 管理器控制台安装了 FontAwesome。这将两个文件(font-awesome.css/font-awesome.min.css)放在 ~/Content 文件夹和 ~/fonts 下的 fonts 文件夹中。当我打开 font-awesome.css 时,这看起来是正确的。
@font-face
font-family: 'FontAwesome';
src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0')
format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?
v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?
v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?
v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?
v=4.7.0#fontawesomeregular') format('svg');
font-weight: normal;
font-style: normal;
我验证了参考路径是正确的
我在 BundleConfig.cs 中包含了这行代码,以便在项目中引用这个库
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/bootstrap-datepicker.css",
"~/Content/StickyFooter.css",
"~/Content/font-awesome.css"
));
在 _Layout.cshtml 页面中像这样引用捆绑文件。
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
这行代码只显示方框。
<span class="input-group-prepend"><i class="fas fa-angle-double-down"></i></span>
Or
<span class="input-group-prepend"><i class="fa-angle-double-down"></i></span>
请建议我缺少什么。
【问题讨论】:
请发布您的BundleConfig.cs
的相关部分(包括字体 Awesome css 的整个捆绑包)。也请张贴您在页面上包含此捆绑包的位置。还要确保你已经清除了浏览器缓存
我更新了原始帖子以包含您询问的详细信息。我也以另一种方式引用了这个类。请告诉我
【参考方案1】:
您需要使用的类是 fa fa-angle-double-down
,而不是您列出的 2 次尝试:fas fa-angle-double-down
和 fa-angle-double-down
<span class="input-group-prepend"><i class="fa fa-angle-double-down"></i></span>
请注意,fa
前缀在版本 5 中已被弃用,取而代之的是 fas
、fal
、far
和 fab
,我确信这就是您正在查看的文档中提到 @ 的原因987654332@。但是,Nuget 上最新版本的 FontAwesome 是 v4.7,因此您应该使用较旧的 fa
前缀。
您可以找到 FontAwesome 4.7 文档和图标列表here
【讨论】:
成功了,谢谢 :) 我们应该传递什么?我查看了这个 url fontawesome.com/icons/angle-double-down?style=solid 和本地 font-awesome.css 文件本身来查找类名,我的变体也是如此。 @Cindy 检查我编辑的答案。我包含了一个指向 v4.7 文档的链接,该链接将反映您需要的类名以上是关于来自 Nuget 包的 Font Awesome 和来自 BundleConfig.cs 的参考的主要内容,如果未能解决你的问题,请参考以下文章
如何使用 Visual Studio 2019 在 ASP.NET Core 2.2 中安装 Font Awesome [关闭]
如何检查我的 C# 应用程序是不是使用来自 nuget 包的正确平台特定 dll?