web-dev-qa-db-ja.com

CDNライブラリを使用してbootstrap 4 betaでopen-iconicをインストールして使用するには?

以下を含めました

<!-- 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>
7

使用する 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>
16
fen1x

Iconicを手動でインストールするには、CSSフォルダーを作成し、その中に_open-iconic-bootstrap.css_ファイルを移動する必要があります。

ファイルを開くと、必要なものを正確に見ることができます(src: url('../fonts/open-iconic.eot');)。 _../_のfontsフォルダーを移動するだけで動作します!

0
Deediezi