2017-03-28 1 views
0

ボタンの内側にグリフコンを入れたいと思います。私はなぜそれが見えないのか分からない。表示されるのはテキストだけですが、グリフコンは表示されません。グリフィコンの内側のボタンは表示されません

Hereです。

<button type="button" class="btn btn-primary"> 
<span class="glyphicon glyphicon-arrow-up"></span>3</button> 
+2

あなたのコードを使用して、実施例私のウェブサイト上で正常に動作します:問題は、このボタンを使用することです。正しいブートストラップCSSファイルが含まれていることを確認してください。 – abraham63

+1

codepenの例から、グリフコンを見ることができますか? – FrenkyB

+0

ブートストラップライブラリをインポートしていないと思います。 –

答えて

2

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<button type="button" class="btn btn-primary"> 
 
<span class="glyphicon glyphicon-arrow-up"></span> 3 </button>

+0

私は問題がcodepenリンクであったと思います。ブートストラップ4.0 alphaを指しています。バージョン3.3.7へのリンクを変更すると、すべて正常に動作し始めました。 – FrenkyB

+0

はブートストラップcdnを含めるかダウンロードする必要があります – spickywolf

1

w3schools

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <title>Bootstrap Example</title> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 

 
<div class="container"> 
 
    <h2>Glyphicon Examples</h2> 
 
    
 
    <button type="button" class="btn btn-primary"> 
 
     <span class="glyphicon glyphicon-arrow-up"></span> 3 
 
    </button> 
 
    
 
</div> 
 

 
</body> 
 
</html>

関連する問題