如何引入使用Bootstrap之glyphicons字体图标组件

1.到bootstrap官网下载Bootstrap：点击打开链接（当前最新版本为bootstrap-3.37）

2.我们需要用到的bootstrap提供的css，js，fonts等都能在下载好的bootstrap/dist文件夹里面找到

fonts文件夹里的内容：

3.把dist文件夹下的余下3个文件夹复制到你的项目的根目录下

4.使用图标组件：test.html

首先引入外部bootstrap样式

 <link rel="stylesheet" media="screen" href="css/bootstrap.css">
写一个搜索框：注意观察i标签的样式class

<form method="get" action="#">
    <div class="row">
    <div class="col-lg-3">
        <div class="input-group">
            <input class="form-control"></input>
            <span class="input-group-btn">
                <button class="btn btn-default"><i class="glyphicon glyphicon-search"></i></button> 
            </span>
        </div>
    </div>
    </div>
    </form>
展示一下效果：

注：如果出现图标无法显示的状况

例如这样：

需要查看自己的bootstrap.css文件是否错放在与fonts文件夹同级的文件中了，如下图这样放置文件会导致图标无法正常显示