bootstrap源码解析笔记

bootstrap的样式都在源码中写好的，所以可以通过一些源码来看我们所使用的的样式是怎么回事。

首先源码可以从官网下载下来，具体如图：

下载下来之后是这个文件夹：

打开这个文件夹，找到文件夹里less文件夹

打开less文件夹，找到grid.less、mixins、variables.less文件，在mixins文件夹里也有个grid.less文件

打开grid.less、mixins文件夹下的grid.less、还有variables.less

在grid.less里我们可以看到.container引用了.container-fixed();的样式，

在mixins文件夹里的grid里有.container-fixed();的具体样式，如图：

而这个.container-fixed()里写的padding-left：floor（@gutter/2）的值，在variables.less文件里，我们可以找到gutter的值为30px，则padding-left值为15px即在栅格系统中默认容器padding-left值为15px。

同样的道理，我们可以在grid.less文件里看到的内容，到mixins文件夹的grid.less中找详细信息，再到variables.less中找到具体值。就这样一层层的引用下来。

row、column、行偏移、列偏移等都可以从这3个文件里看到相关内容。