Twitter Bootstrap是最近最流行的前端框架。它是时尚，直观，功能强大的移动第一前端框架，可用于更快，更轻松地进行Web开发。它使用HTML，CSS和Javascript。本教程将教您Bootstrap Framework的基础知识，您可以使用它们轻松地创建Web项目。本教程分为多个部分，例如Bootstrap基本结构，Bootstrap CSS，Bootstrap布局组件和Bootstrap插件。每个部分均包含相关主题，并提供了简单而有用的示例。

为什么要学习Bootstrap？

• 移动优先方法-Bootstrap 3框架由整个库中的移动优先样式组成，而不是在单独的文件中。
• 浏览器支持-所有流行的浏览器都支持它。

• 易于入门-只需具备HTML和CSS的知识，任何人都可以入门Bootstrap。另外，Bootstrap官方站点也提供了很好的文档。
• 响应式设计-Bootstrap的响应式CSS可以适应台式机，平板电脑和手机。有关响应式设计的更多信息，请参见“引导响应式设计“一章。

• 提供了一个干净统一的解决方案，用于为开发人员构建界面。
• 它包含易于定制的美观实用的内置组件。
• 它还提供基于Web的自定义。
• 最重要的是，它是开源的。

Hello World使用Bootstrap。

只是为了给您带来一些关于Bootstrap的兴奋，我将为您提供一个小的常规Bootstrap Hello World程序，您可以使用Demo链接进行尝试。

      
      
      
      
      
      
      
      
      
      
   
   
   
      
Hello, world!

      
      
      
      
      
      
   

Bootstrap的应用

• 脚手架-Bootstrap提供了具有网格系统，链接样式和背景的基本结构。 Bootstrap基本结构部分将对此进行详细介绍。
• CSS -Bootstrap具有全局CSS设置，通过可扩展类设置样式和增强的基本HTML元素以及高级网格系统的功能。 《使用CSS进行引导》一节中对此进行了详细介绍。
• 组件-Bootstrap包含十几个可重用的组件，旨在提供图标，下拉菜单，导航，警报，弹出窗口等。这在“布局组件“小节中有详细介绍。
• JavaScript插件-Bootstrap包含十几个自定义jQuery插件。您可以轻松地将它们全部或一一包含。 Bootstrap插件一节中对此进行了详细介绍。
• 自定义-您可以自定义Bootstrap的组件，LESS变量和jQuery插件以获得自己的版本。

听众

本教程是为具有HTML和CSS基本知识并渴望开发网站的任何人准备的。完成本教程后，您会发现自己在使用Twitter Bootstrap开发Web项目方面具有中等水平的专业知识。

先决条件

在开始本教程之前，我们假设您已经了解HTML和CSS的基础知识。如果您不太了解这些概念，那么我们建议您阅读有关HTML教程和CSS教程的简短教程。