我们在编写HTML和PHP时，只是在PC端调试，在使用手机浏览时，出现各种错位。
Bootstrap可以说是针对跨设备跨分辨率进行自适应的一个很好的框架。
在考取1+x Web前端资格证书时也有学习到，这里进行复习巩固。
Bootstrap是目前最受欢迎的前端框架之一。Bootstrap是基于HTML、CSS、JavaScript的，它简洁灵活，能够在很大程度上降低Web前端开发的难度，因此深受广大Web前端开发人员的喜爱。
Bootstrap是一个简洁、直观、强悍的前端开发框架，只要学习并遵守它的标准，即使是没有学过网页设计的开发者，也能做出很专业、美观的页面，极大地提高工作效率。Bootstrap是目前最流行的一套前端开发框架，集成了HTML、CSS和JavaScript技术，为网页快速开发提供了包括布局、网格、表格、按钮、表单、导航、提示、分页、表格等组件。本章主要介绍Bootstrap的发展、优势、特性、网站欣赏和资源。
是基于HTML、CSS、JavaScript的简洁、直观、强悍的前端开发框架，使用它可以快速、简单地构建网页和网站。
1.2.1 Bootstrap 4的构成
Bootstrap 4构成模块从大的方面可以分为页面布局、页面排版、通用样式、基本组件和jQuery插件等部分。下面简单介绍一下Bootstrap 4中各模块的功能。
1．页面布局布局对于每个项目都必不可少。Bootstrap在960栅格系统的基础上扩展出一套优秀的栅格布局，而在响应式布局中有更强大的功能，能让栅格布局适应各种设备。这种栅格布局使用也相当简单，只需要按照HTML模板应用，即可轻松构建所需的布局效果。
2．页面排版页面排版的好坏直接影响产品风格，在Bootstrap中，页面的排版都是从全局的概念上出发，定制了主体文本、段落文本、强调文本、标题、Code风格、按钮、表单、表格等格式。
3．通用样式Bootstrap 4定义了通用样式类，包括边距、边框、颜色、对齐方式、阴影、浮动，显示与隐藏等，可以使用这些通用样式快速开发，无须再编写大量CSS样式。
4．基本组件基本组件是Bootstrap的精华之一，它们都是开发者平时需要用到的交互组件。例如按钮、下拉菜单、标签页、工具栏、工具提示和警告框等。这些组件都配有jQuery插件，运用它们可以大幅度提高用户的交互体验，使产品不再那么呆板、无吸引力。
5．jQuery插件
Bootstrap中的jQuery插件主要用来帮助开发者实现与用户交互的功能。下面是Bootstrap提供的常见 插件 。
（1）模态框（Modal）：在JavaScript模板基础上自定义的一款灵活性极强的弹出蒙版效果的插件。
（2）下拉菜单（Dropdown）：Bootstrap中一款轻巧实用的插件，可以帮助实现下拉功能，例如下拉菜单、下拉工具栏等。
（3）滚动监听（Scrollspy）：实现监听滚动条位置的效果，例如在导航中有多个标签，用户单击其中一个标签，滚动条会自动定位到导航中标签对应的文本位置。
（4）标签页（Tab）：这个插件能够快速实现本地内容的切换，动态切换标签页对应的本地内容。
（5）工具提示（Tooltip）：一款优秀的jQuery插件，无须加载任何图片，采用CSS 3新技术，动态显示存储的标题信息。
（6）弹出提示（Popover）：在Tooltips的插件上扩展，用来显示一些叠加内容的提示效果，此插件需要配合Tooltips使用。
（7）警告框（Alert）：用来关闭警告信息块。
（8）按钮（Button）：用来控制按钮的状态。
（9）折叠（Collapse）：一款轻巧实用的手风琴插件，可以用来制作面板或菜单折叠效果。
（10）轮播（Carousel）：实现图片播放功能的插件。
Bootstrap拥有以下特色。
（1）支持响应式设计：从Bootstrap 2开始，提供完整的响应式特性。所有的组件都能根据分辨率和设备灵活缩放，从而提供一致性的用户体验。
（2）适应各种技术水平：Bootstrap适应不同技术水平的从业者，无论是设计师，还是程序开发人员，不管是骨灰级别的大牛，还是刚入门槛的菜鸟，使用Bootstrap既能开发简单的小东西，也能构造更为复杂的应用。
（3）跨设备、跨浏览器：最初设想的Bootstrap只支持现代浏览器，不过新版本已经能支持所有主流浏览器，甚至包括IE 7。从Bootstrap 2开始，提供对平板和智能手机的支持。
（4）提供12列网格布局：网格系统不是万能的，不过在应用的核心层有一个稳定和灵活的网格系统可以让开发变得更简单。
（5）样式化的文档：与其他前端开发工具包不同，Bootstrap优先设计了一个样式化的使用指南，不仅可以用来介绍特性，更可以用来展示最佳实践、应用以及代码示例。
（6）不断完善的代码库：尽管经过gzip压缩后，Bootstrap只有10KB大小，但是它却仍是最完备的前端工具包之一，提供了几十个全功能的随时可用的组件。
（7）可定制的jQuery插件：任何出色的组件设计，都应该提供易用、易扩展的人机界面。Bootstrap为此提供了定制的jQuery内置插件。
（8）选用LESS构建动态样式：当传统的枯燥CSS写法止步不前时，LESS技术横空出世。LESS使用变量、嵌套、操作、混合编码，帮助用户花费很少的时间成本，编写更快、更灵活的CSS。
（9）支持HTML 5：Bootstrap支持HTML 5标签和语法，可在HTML 5文档类型基础上进行设计和开发。
（10）支持CSS 3：Bootstrap支持CSS 3所有属性和标准，逐步改进组件以达到最终效果。
（11）提供开源代码：Bootstrap全部托管于GitHub（https://github.com/），完全开放源代码，并借助GitHub平台实现社区化开发和共建。
本文由 LceAn 创作，采用 知识共享署名4.0 国际许可协议进行许可。
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名。