Question

我正在使用bootstrap作为UI开发angularjs应用程序。我已经从YouTube上下载了一个我正在关注的教程，我遇到的问题是我的图标没有显示。

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap@*" data-semver="4.0.5" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" />
    <script data-require="bootstrap@*" data-semver="4.0.5" src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <div class="container-fluid"> 
    <div class="row">
      <div class="col-xs-12">
        <h1><span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> Hello Plunker!</h1>
      </div>

    </div>
    <div class="row">
      <div class="col-sm-3">
        Nav
      </div>
      <div class="col-sm-9">
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
      </div>
    </div>
    </div>
  </body>

</html>

Answer 1

我建议你使用 Font Awesome 图标包，因为不再支持Bootstrap v4 glyphicons。我甚至不确定我是否看到过使用Bootstrap字形的网站。几乎每个使用图标的网站都是Font Awesome。看一看，我相信你会找到你需要的东西。

Font Awesome：http://fontawesome.io/icons/

如果这还不够，您可以使用SVG，但来自不同的存储库：https://simpleicons.org/

或者这些，也来自不同的存储库：http://konpa.github.io/devicon/

Answer 2

从Bootstrap 4开始，删除了与版本3中的Bootstrap可交付程序一起打包的glyphicons字体。

可以找到更多信息以及其他选项here。

没有出现的Bootstrap图标

2 个答案: