【问题标题】:How to install and use open-iconic with bootstrap 4 beta using CDN library?如何使用 CDN 库安装和使用带有 bootstrap 4 beta 的 open-iconic?
【发布时间】:2018-02-19 07:01:26
【问题描述】:

我已经包括在下面了

<!-- Bootstrap 4.0 Beta -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha256-m/h/cUDAhf6/iBRixTbuc8+Rg2cIETQtPcH9D3p2Kg0=" crossorigin="anonymous" />
<!-- open-iconic-bootstrap (icon set for bootstrap) -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" integrity="sha256-BJ/G+e+y7bQdrYkS2RBTyNfBHpA9IuGaPmf9htub5MQ=" crossorigin="anonymous" />

并没有运气如下使用它

<span class="oi oi-icon-person" title="person" aria-hidden="true"></span>

【问题讨论】:

    标签: bootstrap-4 iconic


    【解决方案1】:

    要手动安装 Iconic,您需要创建一个 CSS 文件夹并在其中移动 open-iconic-bootstrap.css 文件。

    如果我们打开文件,我们可以准确地看到我们需要的内容 (src: url('../fonts/open-iconic.eot');)。只需将字体文件夹移至../ 即可!

    【讨论】:

      【解决方案2】:

      使用oi-person 类而不是oi-icon-person

      <!-- Bootstrap 4.0 Beta -->
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha256-m/h/cUDAhf6/iBRixTbuc8+Rg2cIETQtPcH9D3p2Kg0=" crossorigin="anonymous" />
      <!-- open-iconic-bootstrap (icon set for bootstrap) -->
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" integrity="sha256-BJ/G+e+y7bQdrYkS2RBTyNfBHpA9IuGaPmf9htub5MQ=" crossorigin="anonymous" />
      
      <span class="oi oi-person" title="person" aria-hidden="true"></span>

      【讨论】:

      • 如果我想离线使用怎么办??
      • 您需要整个目录吗?字体,png,精灵,svg,webp?里面有很多文件。
      猜你喜欢
      • 1970-01-01
      • 2021-08-24
      • 1970-01-01
      • 2018-04-12
      • 2018-06-22
      • 1970-01-01
      • 2018-01-23
      • 2018-06-07
      • 2016-01-09
      相关资源
      最近更新 更多