Bootstrap 3.2.0 源码试读 2014/08/14
第三部分 Glyphicons
263至268行
@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');
}
又搞出来一个空行，我发现这个版本空行很多，吐槽一下。
这一部分开始，开始使用WEB字体了，其实这玩意98年的据说就已经出现了。
WEB字体可以分为四种，看上面不同的扩展名就清楚了。
1、.eot，这种是微软件的专有格式，需要版本滴，Embedded OpenType
2、.ttf/.otf，这是我们台式机上使用的格式，TrueType/Open Type
3、.woff，这种才是真是开放的字体，专门为WEB设计，其实就是压缩过的.ttf/.otf。
4、.svg，这种最初是IOS系统使用的，Scalable Vector Graphics。
回头看源码，
@font-face ，这个是告诉浏览器，这部分开始定义的是WEB字体。
font-family后面是字体的名字，'Glyphicons Halflings'。
src: url(*) format(*)，这类似的行就是用来引入字体文件的了，为了区配不同的浏览器，所以搞了这么一大砣。
269至280行
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
有了WEB体，这段是从用来定义通用的引用的语法了。
首先，定义的是内嵌的盒元素inline-block，这样才能为其设置不同的位置属性。
行高为字体大小的1倍，位置为相对，离顶部1px。
字体的名字是上面定义过的'Glyphicons Halflings'，
font-style，用来设置字体的风格，normal是默认值，字体的标准样式。
如果设置为italic,浏览器会显示一个斜体的字体样式，条件是字体本身有斜体的设计。
如果设置为oblique，浏览器会显示一个倾斜的字体样式。oblique是用来应付字体本身没有斜体样式的情况，就是说字体设计本身没考虑要是斜体应该怎么显示，这时候设置oblique就可以模拟斜体的效果。
当然也可以设置inherit，继承。
font-weight，用来控制字体的粗细。默认值是normal。
与font-style类似，如果字体设计本身集成了粗体的设计，设置成bold就成了。否则只能通过模拟的方式来实现。
bolder（更粗）与lighter（更细）。
100至 900，其中400相当于normal，700相当于bold。
如果想从父元素继承，设置为inherit。
*-font-smoothing是用来为不同浏览器，优化显示的效果的。
281至880行
.glyphicon-asterisk:before {
content: "\2a";
}
...
这一段就是大体量的ICON定义了。用到了before及content语法，都是前插内容。\开头的是16进制的值。
待续 ... ...