本书由浅入深，全面、系统、详尽地介绍了Bootstrap 4框架相关技术在Web和移动Web开发领域的应用。书中提供了大量的代码示例，读者可以通过这些示例深入理解Bootstrap框架相关的知识点，同时还可以举一反三，将这些示例应用到实战项目之中。本书从基本原理到实战应用，几乎涉及Bootstrap框架Web开发领域的绝大部分内容，是一本集理论与实战的综合性参考书。

本书共15章，分为3部分。第一部分为Bootstrap基础，主要介绍Bootstrap框架的基础知识与开发入门等内容；第二部分为Bootstrap框架，主要介绍Bootstrap脚手架、Bootstrap样式设计、Bootstrap组件设计、Bootstrap插件设计与Bootstrap多媒体设计等相关的内容；第三部分为Bootstrap实战，详细讲解如何基于Bootstrap框架开发Web应用的过程与方法，同时还包括整合jQuery UI框架和jQuery Mobile框架开发移动应用的案例。

本书适合所有想全面深入学习Bootstrap框架开发技术的人员阅读，尤其适合正在应用Bootstrap框架做移动应用开发的人员阅读。对于大中专院校相关专业的学生和培训机构的学员，本书也是一本不可多得的参考书。

杨旺功，北京印刷学院新媒体学院数字媒体艺术专业教师，主要研究方向是信息与交互设计、虚拟现实、数字娱乐和新媒体艺术等，具有丰富的数字媒体交互产品设计和移动应用UI设计的教学经验。在数字艺术与设计领域成果显著，发表数字艺术论文8篇，出版著作6部。

前 言

Bootstrap是Twitter公司推出的一款前端开发框架，在当前的Web和移动Web应用设计领域中非常受欢迎。基于Bootstrap框架可以实现前端UI设计与后台业务逻辑设计的协作开发，可以完美地实现响应式布局界面，可以无缝适配如PC、平板和手机等多种设备终端，可以说Bootstrap是所有前端开发框架中的集大成者。

目前图书市场关于Bootstrap框架开发的图书不少，但真正从实际应用出发，通过具体案例来指导读者提高应用开发水平的图书却不多。本书以实战为主旨，通过大量的代码实例与项目实例，让读者全面、深入、透彻地理解Bootstrap框架开发的各种热门技术、主流框架及其整合使用，提高实际开发水平和项目实战能力。

关于Bootstrap框架

? Bootstrap不仅是一个CSS框架

我们知道，Bootstrap框架是基于CSS标准构建的，但如果仅仅认为其是一个前端CSS框架就太狭隘了。Bootstrap框架最初是由Twitter公司的两个员工发布的，旨在能够让Web应用适应各种不同的设备终端，一经推出就受到业内开发人员的广泛关注。随着Bootstrap框架的快速发展，很快成为开发跨平台和跨设备应用的首选前端技术。

目前，Bootstrap已经是一款集成HTML 5、CSS 3和JavaScript技术的开发框架，自身已经构成了独立的开发体系，基于Bootstrap二次开发的插件也非常受欢迎。因此，Bootstrap不再仅仅是一个CSS框架，它涵盖的内容已经十分广泛了。

? Bootstrap框架的主流地位

Bootstrap框架在学习上需要花费一定的功夫，但在使用上还是照顾设计人员的常规思路，对于有前端开发基础的设计人员来说还是易学易用的。

Bootstrap框架的移动开发特性与当前移动互联网在蓬勃发展的大背景下，二者是相得益彰、相互助力。一方面，随着移动应用程序的大行其道，促使了Bootstrap框架的不断改进与完善；另一方面，随着Bootstrap框架性能的不断提升，可以帮助前端设计开发人员利用Bootstrap框架开发出更强大的移动应用程序。可以说，Bootstrap框架已经占据了移动应用开发的主流地位。

? 本书与Bootstrap框架

许多人在学习Bootstrap框架的时候经常会搞混一些概念和用法。从某种角度来说，Bootstrap框架是一系列前端技术的集合，并且是不断向前发展的技术。为了帮助那些对移动开发感兴趣的读者在较短的时间内掌握Bootstrap框架开发技术，笔者编写了本书。

本书首先从Bootstrap框架的基础入手，让读者理解Bootstrap框架究竟如何使用。然后针对Bootstrap框架的内容由浅入深一一进行讲解，尤其是在移动开发中的应用，以期读者能够掌握Bootstrap框架的核心内容。最后讲解基于Bootstrap框架的开发实战，让读者快速成为高效而专业的开发者。

本书更新的内容

Bootstrap框架已经发展到了v4版本，为了跟上移动互联网的步伐，Bootstrap默认就是响应式的，所以很多组件和类都发生了巨大的变化，相对以前的版本本书升级了以下内容。

（1）增加了FlexBox弹性布局的知识。

（2）更新CSS样式，从Less到Sass。

（3）分页组件进行重大调整。

（4）label组件和badge组件合并。

（5）全部内容在Bootstrap 4中重新测试。

本书特色

? 内容丰富，覆盖面广

本书基本涵盖Bootstrap框架开发的所有常用知识点及开发工具。无论是初学者，还是有一定基础的Web开发人员，通过阅读本书都将获益匪浅。

? 注重实践，快速上手

本书不以枯燥乏味的理论知识作为讲解的重点，而是从实践出发，将必要的理论知识和大量的开发实例相结合，并将笔者多年的实际项目开发经验贯穿于全书的讲解中，让读者可以在较短的时间内理解和掌握所学的知识。

? 内容深入、专业

本书直击要害，先从标准文档入手，深入浅出地讲解Web技术的原理；然后结合移动Web开发的相关工具，介绍实际的移动Web开发，让读者学有所用。

? 实例丰富，随学随用

本书提供大量来源于真实Web开发项目的实例，并给出丰富的程序代码及注释。读者通过研读这些例子，可以了解实际开发中编写代码的思路和技巧，而且还可以直接复用这些代码，以提高自己的开发效率。

本书体系

第一部分 Bootstrap基础（第1、2章）

本部分涵盖的内容包括Bootstrap框架的基础知识和开发入门等内容。

第二部分 Bootstrap框架（第3～12章）

本部分主要介绍Bootstrap框架的脚手架、样式设计、组件设计、插件设计与多媒体设计等相关的内容。

第三部分 Bootstrap实战（第13～15章）

本部分详细讲解使用Bootstrap框架开发Web应用与移动应用的实战方法，包括多个Web应用与移动应用的案例。

源码下载与技术支持

本书示例源代码请扫描右边二维码下载。如果有疑问，请联系booksaga@163.com，邮件主题为“Bootstrap 4 Web设计”。

本书读者

? Bootstrap初学者

? 需要全面学习Bootstrap移动应用开发技术的人员

? Web前端开发工程师

? 移动应用开发人员

? 高等院校和培训学校相关专业的师生

作 者

2020年4月