css - Glyphicon 有时显示有时不显示在我的页面中

Question

我从这个 link 下载了 Bootstrap v3.1.1 .我在我的 ASP.NET MVC 元素中使用 Glyphicon。

我面临的问题是，在我看来，我有时可以看到 Glyphicon 图标，但有时无法加载。我很困惑为什么会这样。这是我的 CSS:

<span class="glyphicon glyphicon-circle-arrow-right" style="font-size: 3em;color:grey;"></span>

我所做的是，将 bootstrap.min.css 放入 Content 文件夹，将 Fonts 文件夹放入我的元素和外部 content 文件夹。

我这样做的原因是，当我将 fonts 文件夹放入 content 时，它根本没有显示。所以我喜欢这个。

元素结构:

元素名称->内容->bootstrap.min.css, bootstrap.css

元素名称->字体

我的代码:

<table>
    <tr>
        <td>

           <h3> Image <span class="glyphicon glyphicon-circle-arrow-right" style="font-size: 3em;color:grey;"></span></h3>

        </td>
    </tr>
</table>

Answer 1

不要更改默认文件夹结构，否则您可能必须更改 bootstrap.css 中的 url

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('Content/fonts/glyphicons-halflings-regular.eot');
  src: url('Content/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded- opentype'), url('Content/fonts/glyphicons-halflings-regular.woff') format('woff'), url('Content/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('Content/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

让字体在contents文件夹下，这是默认的。

除此之外，这是 bootstrap 中的一个已知问题，特别是如果您下载自定义版本的 bootstrap 3。

要获得正确的字体，请转到 Bootstrap 主页并下载完整的 .zip 文件。将四个字体文件从那里提取到您的字体目录，一切都应该工作。