是没有这个名字的css文件的，但有可能存在于bootstrap.css中，另外，如果要使用矢量图标的话要引入目录里的fonts文件才可以使用
@font-face {font-family: 'Glyphicons Halflings'
src: url('../fonts/glyphicons-halflings-regular.eot')
src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg')
}
.glyphicon {
position: relative
top: 2px
display: inline-block
font-family: 'Glyphicons Halflings'
-webkit-font-smoothing: antialiased
font-style: normal
font-weight: normal
line-height: 1
-moz-osx-font-smoothing: grayscale
color: #8b919c
}
现在比较常用的主流框架有Vue、React、Angular。Angular
Angular原名angularJS诞生于2009年，之前我们都是用jquery开发，自从angular的出现让我们有了新的选择，它最大的特点是把后端的一些开发模式移植到前端来实现，如MVC、依赖注入等，创新式的双向数据绑定不知简化了我们多少代码，让我们为之疯狂，特别是表单处理方面，从此名声大噪。
好的框架一般会有两个结果，一个继续不断更新迭代，避免被拍死在沙滩上，一个是被一些大公司收购焕发第二春，angular属于后者被google所收购，且从2.0后改名angular并使用微软的typescript作为开发语言，目前最新版本8.0，照说傍上google与微软这两条大船，前途应该不可限量才对，然而造化弄人，现在angular的市场份额已经被React这个后起之秀和Vue这颗新星远远地甩到脑后。
React
React，facebook出品，正式版推出是在2013年，比angular晚了4年，但得益于其创新式的VirtualDOM，性能上碾压angularJS，一经推出，火的一塌糊涂。 特点很多，VirtualDOM、JSX、Diff算法等，支持ES6语法，采用函数式编程，门槛稍高，但也更灵活，能让开发具有更多可能性。
Vue
Vue作为最后推出的框架（2014年），借鉴了前辈angular和react的特点（如VirtualDOM、双向数据绑定、diff算法、响应式属性、组件化开发等）并做了相关优化，使其使用起来更加方便，更容易上手，比较少适合初学者。网上有很多人说Vue不适合做大型项目，纯属扯淡，Vue在这方面已经优化得很好，当然，大量的响应式属性（监听属性）也许会用一定的性能损耗，但在硬件、网络大力发展的今天，这些细微的性能差异几乎感觉不到。
既然楼主说是弹性盒，那就用弹性盒的相关术语来进行分析。
首先分析图片，一个大容器中包含三个项目，你会发现单纯的给容器加一个display:flex的声明是不可以的，因为这个声明默认容器内的项目在一行显示，并且不会溢出。
那么我们就需要一个声明让项目遇到容器边界时自动换行，就是flex-wrap: wrap这个声明。
换行之后你会发现项目与容器的边界是挨在一起的，从图中明显可以看出项目div1在主轴上是居中显示的，三个项目在交叉轴上又是居中，那么
justify-content: space-around表示 自动分配距离，每个项目两侧的间隔相等。
align-items: center表示交叉轴居中。
参考代码如下：
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
html,body{margin:0padding:0}
.box{width:500pxheight:500pxborder:1px solid #faamargin:50px auto
display:flex
flex-wrap: wrap
justify-content: space-around
align-items: center
}
.box div:nth-child(1){width:450pxheight:200pxborder:1px solid #faa}
.box div:nth-child(2){width:200pxheight: 150pxborder:1px solid #faa}
.box div:nth-child(3){width: 150pxheight:100pxborder:1px solid #faa}
</style>
</head>
<body>
<div class="box">
<div>1</div>
<div>2</div>
<div>3</div>
</div>
</body>
</html>
或者第二个参考代码如下
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
html,body{margin:0padding:0}
.box{width:600pxheight:500pxborder:1px solid #faamargin:50px auto
padding:10px
display:flex
flex-wrap: wrap
justify-content: space-between
align-items: center
}
.box div:nth-child(1){width:600pxheight:200pxborder:1px solid #faa}
.box div:nth-child(2){width:260pxheight: 150pxborder:1px solid #faa}
.box div:nth-child(3){width: 200pxheight:100pxborder:1px solid #faa}
</style>
</head>
<body>
<div class="box">
<div>1</div>
<div>2</div>
<div>3</div>
</div>
</body>
</html>
