文档介绍：下载好的 bootstrap 版本含有 css 、 js、 img 文件结构: bootstrap/ ├── css/ │├── │├── ├── js/ │├── │├── └── img/ ├── glyphicons- └── glyphicons-halflings- 文档章节: Bootstrap 中的 HTML 、 CSS 和 JS 适用于各类设备: 脚手架: 全局性的样式文件, 用于重置背景、链接样式、栅格系统等, 并包含两个简单的布局结构基本 css 样式:常见的 HTML 元素-- 如排版、代码、表格、表单、和按钮的样式。还包括 Glyphicons, 一个非常棒的图标集。 Glyphicons : 组件:常见界面组件-- 如标签、 pill 、导航、警告、页面标题的基本样式。 js 插件: 和组件类似, 这些 Javascript 插件用来实现提示(tooltip) 、弹出框(popover) 、模态对话框(modal) 等具有交互性的组件。组件列表: 组件库和 JavaScript 插件集一同提供了以下组件元素。?按钮组?按钮下拉菜单?用于导航的标签、 pill 、列表?导航条? Labels ? Badges ? Page headers and hero unit ?缩略图?警告对话框?进度条?模态对话框(Modals) ?下拉菜单(Dropdowns) ? Tooltips ? Popovers ? Accordion ? Carousel ? Typeahead 在后面的文档中, 我们会挨个详细的介绍这些组件的细节。在此之前, 先来看看如何使用并定制它们。( js 文件引用使用 script src 、 css 文件引用使用 link href ) 为了使典型的 htm l 文件成为一个 boolstra p 没干开发任何网站和应用程序就必须设置加入下载的 boolstrap 的两个文件--js 、 css =============================================================================== ==================================== =========================================== 脚手架: 全局设置: 必须使用 HTML5 文档类型<!doctype html><html lang ="en"><html> 栅格系统: 对于简单的两列式布局, 容器, * 列即可。由于默认是 12 列的栅格, * 列所跨越的栅格数之和最多是 12( 或者等于其父容器的栅格数)。 1.<div class="row"> 2.<div class="span4">...</div> 3.<div class="span8">...</div> 4.</div> 两列,两列的和总共是 12 个栅格。<div class="row"> <div class="span6" align="right"> xiangqian <div class="row"> <div class="span1" align="right"> 一份</div> <div class="span5" align="right"> 五份</div> </div> </div> </div> 自我理解:列的嵌套。创建一个简单的容器,在类中定义 span 大小,最多为 12列底下进行分布的话,则每行 span 定义的大小之和应等于在最外层定义的数量其实也就是控制比例的协调,在 中可是看到简单示例流式嵌套布局: 和固定栅格的嵌套有一点不同:被嵌套的列数之和要等于 12 。这是因为流式栅格使用百分比来设置每列的宽度。 1.<div class="row-fluid"> 2. <div class="span12"> 3. Fluid 12 4. <div class="row-fluid"> 5. <div class="span6"> 6. Fluid 6 7. <div class="row-fluid"> 8. <div class="span6">Fluid 6</div> 9. <div class="span6">Fluid 6</div> 10. </div> 11. </div> 12. <div c