来自Nuget包的Font Awesome和来自BundleConfig.cs的引用

Question

我从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>

请提出我想念的东西。

Answer 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 ，我确定这就是为什么您要查看的文档说fas 。 但是，Nuget上FontAwesome的最新版本是v4.7，因此您应该使用较旧的fa前缀。

你可以找到FontAwesome 4.7文件和图标列表在这里

来自Nuget包的Font Awesome和来自BundleConfig.cs的引用

问题描述

1 个解决方案

解决方案1
0 已采纳 2019-04-11 17:34:15

来自Nuget包的Font Awesome和来自BundleConfig.cs的引用

问题描述

1 个解决方案

解决方案1 0 已采纳 2019-04-11 17:34:15

解决方案1
0 已采纳 2019-04-11 17:34:15