引导程序图标在本地加载，但不在联机时加载

Question

基本上我得到以下HTML：

<button class="disabled btn-primary btn" type="submit" disabled="">
   <i class="glyphicon glyphicon-ban-circle"></i>
   Log in
</button>

在本地该图标在按钮上显示正常，但是当我在Windows Azure上运行时，出现以下带有怪异的外观前缀而不是图标的按钮：

考虑到这一点，我意识到当本地访问我的网站时，浏览器将尝试加载文件：/Content/fonts/glyphicons-halflings-regular.woff（成功完成），而在线（天蓝色）时，它将尝试加载以下文件：在以下位置加载：/fonts/glyphicons-halflings-regular.woff

为什么不将其/ Local前缀放在本地。

我正在使用标准的引导程序文件，它与本地和在线运行的网站完全相同。

另外，我通过以下方式捆绑内容：

    bundles.Add(new StyleBundle("~/Content/bootstrapcss").Include(
                "~/Content/bootstrap/bootstrap.css"));

文件结构如下所示：

引导程序也在寻找这样的文件：

url('../fonts/glyphicons-halflings-regular.woff') 

因此，我想它会在Content文件夹中查找，而不是root用户，因为它当前位于Content / bootstrapcss文件夹中。

Answer 1

我们最近遇到了类似的问题（尽管我们使用的是metroUI - http://metroui.org.ua/ metroUI ）。 实质上，事实证明，我们捆绑了css文件，因此，当我们在Windows Azure中部署应用程序时，没有字体被加载。

在我们的例子中，我们具有以下目录结构：

和modern.css所引用的字体如

../fonts/iconFont.eot

并且我们像这样捆绑css文件：

bundles.Add(new StyleBundle("~/Content/css").Include(
                "~/Content/css/modern.css",
                "~/Content/css/modern-responsive.css"));

由于捆绑，应用程序正在/fonts root目录中的/fonts目录中查找/fonts ，该目录显然不存在。

长话短说，我们最终更改了包名称：

bundles.Add(new StyleBundle("~/Content/css/metroUI").Include(
                "~/Content/css/modern.css",
                "~/Content/css/modern-responsive.css"));

更改捆绑包名称后，一切便开始正常工作。

Answer 2

改变路径确实可行，但是“回答的问题”遗漏了一个关键点。

如果您使用的是引用该捆绑软件的_Layout.cshtml ，它将不再在本地和Azure上运行。

您还需要更新_Layout.cshtml页面！

因此，如果将包路径从Content/css更改为Scripts/css则需要_Layout.cshtml将@Styles.Render("~/Scripts/css")更改为@Styles.Render("~/Scripts/css") 。

Answer 3

发布到Azure Web服务时，ASP.NET Core 2.0 MVC Web应用程序遇到此错误。

我在以下代码中包含样式表。

 <environment include="Development">
        <link href="https://fonts.googleapis.com/css?family=Coda" rel="stylesheet">
        <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-blue.min.css" />
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="~/css/site.css" />
 </environment>

只需将链接复制并粘贴到开发工作以外的任何环境中

<environment exclude="Development">
  <link href="https://fonts.googleapis.com/css?family=Coda" rel="stylesheet">
  <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-blue.min.css" />
  <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
  <link rel="stylesheet" href="~/css/site.css" />
  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute"
  />
  <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>

Answer 4

如果您下载了包含引导程序图标的theme.zip或theme.rar，请在提取之前执行以下操作：

• 右键单击压缩包
• 选中“取消阻止”框（如果可见）

Answer 5

为了使图标正常工作，我必须将图像所在的文件夹的文件夹权限设置为“所有人=已读”