查字典图书网
查字典图书网
1.1 Bootstrap到底是什么 Bootstrap是Mark Otto和Jacob Thornton共同开发的一个开源框架。最初发布Bootstrap的时候，他们两位都在Twitter工作。当时，他们面临着为公司内部提供一套标准化的前端开发工具的需求。在发布Bootstrap的那篇博客中，... 查看全部[ 1.1 Bootstrap到底是什么 ]
bootstrap/ ├─css/ │ ├─ bootstrap.css │ ├─ bootstrap.min.css ├─js/ │ ├─ bootstrap.js │ ├─ bootstrap.min.js ├─img/ │ ├─ glyphicons-halfl... 查看全部[ 1.2 Bootstrap的文件结构 ]
一般Web项目的HTML文件如下所示：、 <!DOCTYPE html> <html> <head> <title>Bootstrap 101 Template</title> </head> <body&g... 查看全部[ 1.3 基本的HTML模板 ]
Bootstrap预定义了一些样式。Bootstrap 1.0使用的是以前的重置样式表，但Bootstrap 2.0则使用Nicolas Gallagher写的Normalize.css（http://necolas.github.com/normalize.css/），HTML5 Boilerpl... 查看全部[ 1.4 全局样式 ]
Bootstrap默认的网格布局（图1-1）包含12列，940像素宽，不支持响应式布局。加载响应式CSS文件后，网格布局会根据视口（viewport）宽度在724像素到1170像素之间伸缩。视口宽度小于767像素时，说明是平板电脑或更小的设备，布局中的列会垂直堆叠起来。默认宽度下，每列宽60像素，且... 查看全部[ 1.5 默认网格系统 ]
流式网格系统的列宽定义使用百分比，而不是像素。流式网格系统与固定网格系统一样都具有响应能力，可适应不同的屏幕和设备。只要把某一行的.row改为.row-fluid，这一行就会成为流式的。不改变列的类，是为了简化固定和流式网格的切换。想平移列？跟固定网格中一样，在要平移的列中添加.offset*类即可... 查看全部[ 1.6 流式网格系统 ]
要在页面中实现固定宽度、居中的布局，只要把内容统统放到<div class="container">...</div>中即可。如果既想实现流式布局，又想把所有内容都封装到一个容器里，可以使用<div class="container-flu... 查看全部[ 1.7 容器布局 ]
要让Bootstrap支持响应式布局，必须在<head>标签中添加一个<meta>标签。另外，如果你下载的文件中没有响应式CSS文件，也要单独下载。响应式布局必需的标签和文件如下所示： <!DOCTYPE html> <html> <he... 查看全部[ 1.8 响应式设计 ]