这里有很多与 Bootstrap 相关的问题。我看到很多人都在使用它。于是我试着研究了一下，找到了官方的 Bootstrap 站点，但是后面只有一个下载部分和几句话。没有什么可以解释它的用途......我只是明白它是一个前端助手。我试图通过谷歌搜索找到一些东西，但没有找到任何具体的东西。我发现的一切都与计算机科学定义有关。
所以，我的问题是：
- 什么是引导程序？
- 它是做什么用的，它如何帮助前端开发？
- 我还想要一些更多的细节来解释它。
问问题
487976 次
11 回答
94
Bootstrap 是由 Twitter 团队开发的开源 Javascript 框架。它是 HTML、CSS 和 Javascript 代码的组合，旨在帮助构建用户界面组件。Bootstrap 也被编程为支持 HTML5 和 CSS3。
它也被称为前端框架。
Bootstrap 是用于创建网站和 Web 应用程序的免费工具集合。
它包含用于排版、表单、按钮、导航和其他界面组件的基于 HTML 和 CSS 的设计模板，以及可选的 JavaScript 扩展。
程序员偏爱 Bootstrap 框架的一些原因
易于上手
大网格系统
大多数 HTML 元素的基本样式（排版、代码、表格、表单、按钮、图像、图标）
广泛的组件列表
捆绑的 Javascript 插件
于 2014-07-16T14:20:55.683 回答
24
据我所知，Bootstrap 是一个定义良好的 CSS。虽然使用 Bootstrap 你也可以使用 JavaScript、jQuery 等。但主要区别在于，使用 Bootstrap 你可以只调用类名，然后在 HTML 表单上获得输出。例如。按钮着色 文本形状，使用布局。对于所有这些，您不必编写 CSS 文件，而只需使用正确的类名来塑造您的 HTML 表单。
于 2014-06-27T09:30:02.760 回答
21
简单来说，您可以将 Bootstrap 理解为由 Twitter 创建的前端 Web 框架，用于更快地创建设备响应式 Web 应用程序。Bootstrap 也可以主要理解为其中定义的 CSS 类的集合，可以简单地直接使用。它在后台使用 CSS、javascript、jQuery 等来为 Bootstrap 元素创建样式、效果和动作。
您可能知道我们使用 CSS 来设置网页元素的样式，并创建类并将类分配给网页元素以将样式应用于它们。此处的 Bootstrap 使设计更简单，因为我们只需要包含 Bootstrap 文件并为我们的网页元素提及 Bootstrap 的预定义类名，它们将通过 Bootstrap 自动设置样式。通过这个，我们摆脱了编写自己的 CSS 类来设置网页元素的样式。最重要的是，Bootstrap 的设计方式使您的网站设备能够响应，这就是它的主要目的。Bootstrap 的其他替代品可能是 - Foundation、Materialize等框架。
Bootstrap 让您无需编写大量 CSS 代码，还可以节省您在设计网页上所花费的时间。
于 2015-03-25T20:33:15.467 回答
17
Bootstrap 是一个开源的 CSS、JavaScript 框架，最初由 twitter 的设计人员和开发人员团队为 twitter 应用程序开发。然后他们将其发布为开源。作为 twitter bootstrap 的长期用户，我发现它是设计移动响应式网站的最佳选择之一。许多 CSS 和 Javascript 插件可用于立即设计您的网站。这是一种快速的模板设计框架。有些人抱怨引导 CSS 文件很重并且需要时间来加载，但这些说法是由懒惰的人提出的。您不必在您的网站中保留完整的 bootstrap.css。您始终可以选择删除网站不需要的组件样式。例如，如果您只使用表单和按钮等基本组件，那么您可以从主 CSS 文件中删除其他组件，例如手风琴等。要开始涉足引导程序，您可以从以下位置下载基本模板和组件getbootstrap网站，让奇迹发生。
于 2014-12-19T17:58:10.810 回答
4
免责声明：我过去使用过 bootstrap，但我从来没有真正理解过它的实际含义，这个描述来自我今天的定义。而且我知道 bootstrap v4 已经过时了，但是我发现 bootstrap v3 文档更加清晰，所以我使用了它。该库不会从根本上改变它所提供的内容。
简要地
Bootstrap 是 CSS 和 javascript 文件的集合，它为标准 html 元素提供了一些漂亮的默认样式，以及一些不是标准 html 元素的常见 Web 内容对象。
打个比方，这有点像在 powerpoint 中应用主题，但对于您的网站：它使事情看起来很漂亮，而无需太多的初始努力。
它由什么组成？
官方 v3 文档将其分为三个部分：
这些大致对应于 Bootstrap 提供的三个主要内容：
- 样式标准 html 元素的纯 CSS 文件。因此，Bootstrap 使您的标准元素看起来很漂亮。例如html：
<input class="btn btn-default" type="button" value="Input">Click me</button> - CSS 文件在标准 html 元素上使用样式，以使它们成为不是标准 html 元素而是标准Bootstrap 元素的东西（例如https://getbootstrap.com/docs/3.3/components/#progress）。通过这种方式，Bootstrap 以视觉上一致的方式扩展了“标准”Web 元素列表。例如html：
<span class="glyphicon glyphicon-align-left"></span> - CSS 类的设计考虑到了 jQuery。在内部，Bootstrap 使用 jQuery 选择器来动态修改样式并与 DOM 交互，从而为用户提供相同的功能。我相信这需要更多解释，所以...
使用 Javascript/jQuery
Bootstrap扩展了 jQuery。如果我们查看源代码，我们可以看到它使用 jQuery 来执行以下操作：设置 keydown 事件的侦听器以与 dropdowns 交互。当您在<script>标签中导入它时，它会执行所有这些 jQuery 设置，因此您需要确保在 Bootstrap 之前加载 jQuery。
此外，它比普通的 jQuery 更紧密地将 javascript 与 DOM 联系起来，提供了一个javascript类接口。例如，以编程方式切换按钮。请记住，CSS 只是定义了事物的外观，因此这些操作的主要工作往往是及时修改哪些 CSS 类应用于元素。这种基于用户输入的更改不能用纯 CSS 完成。
还有其他标准的用户交互，我们互联网的居民已经习惯了 CSS 没有涵盖的内容。比如，单击一个链接可以向下滚动页面而不是更改页面。Bootstrap 为您提供的其中一件事是在您自己的网站上实现此行为的简单方法。
标准
我在这里多次提到“标准”这个词，这是有充分理由的。我认为 Bootstrap 提供的最好的东西是一套好看的标准。您可以随意修改默认主题，但它比原始 html、css 和 js 更好。这就是为什么它被称为“框架”。
不同的 Web 浏览器有不同的默认样式并且可以有不同的行为，并且需要不同的 CSS 前缀和类似的东西。Bootstrap 的一个主要好处是它比自己编写所有跨浏览器的东西更可靠（我敢肯定，你仍然会遇到问题，但它更容易）。
我认为当 gulp 和 babel 不那么流行时，Bootstrap 更受欢迎。看看 Bootstrap，它似乎来自每个人都编译他们的 javascript 之前的时间。它仍然具有相关性，但您现在可以从其他来源获得一些好处。
最新版本的 CSS 允许您在这些静态列表更改时定义它们之间的转换。Bootstrap 的原始版本实际上早于该功能在浏览器中的广泛采用，因此它们仍然有自己的动画类。有一些 Bootstrap 是这样的：周围出现了其他东西，使它看起来有点多余。
于 2018-11-20T04:58:27.250 回答
2
Bootstrap 是一个包含许多组件的 HTML、CSS、JS 框架，可让您非常快速地创建漂亮而现代的网站或 Web 应用程序。
以下网站包含示例、元素和可重用组件，您可以使用引导框架将它们集成到您的项目中
于 2016-04-17T22:51:38.470 回答
2
按照今天的标准和网络术语，我会说 Bootstrap 实际上不是一个框架，尽管这是他们的网站所声称的。大多数开发人员考虑 Angular、Vue 和 React 框架，而 Bootstrap 通常被称为“库”。
但是，准确地说，Bootstrap 是一个开源的、移动优先的CSS、JavaScript 和 HTML设计实用程序集合，旨在提供比从头开始编码更快（更智能）开发常用 Web 元素的方法.
一些促成 Bootstrap 成功的核心原则：
- 它是可重复使用的
- 它很灵活（即：允许自定义网格系统、轻松更改响应断点、列间距大小或状态颜色；根据经验，大多数设置都由全局变量控制）
- 很直观
- 它是模块化的（JavaScript 和 (S)CSS 都使用模块化方法；人们可以轻松找到有关制作自定义 Bootstrap 构建的教程，仅包含他们需要的部分）
- 具有高于平均水平的跨浏览器兼容性
- 开箱即用的网络可访问性（屏幕阅读器就绪）
- 有据可查
它包含以下设计模板和功能：布局、排版、表单、导航、菜单（包括下拉菜单）、按钮、面板、徽章、模式、警报、选项卡、可折叠、手风琴、轮播、列表、表格、分页、媒体实用程序（包括嵌入、图像和图像替换）、响应实用程序、基于颜色的实用程序（主要、次要、危险、警告、信息、浅色、深色、静音、白色）、其他实用程序（位置、边距、填充、大小调整、间距、对齐、可见性），scrollspy，词缀，工具提示，弹出框。
默认情况下，它依赖于 jQuery，但您会发现由每个现代流行的渐进式 JavaScript 框架提供支持的 jQuery 免费变体：
- React-Bootstrap - React 驱动的 Bootstrap
- BootstrapVue - Vue 驱动的 Bootstrap
- ng-bootstrap - Angular 驱动的 Bootstrap
使用 Bootstrap 很大程度上依赖于应用某些类（或者，取决于 JS 框架：指令、方法或属性/道具）以及使用特定的标记结构。
文档通常包含通用示例，可以轻松复制粘贴并用作入门模板。
使用 Bootstrap 开发的另一个优势是其充满活力的社区，可转化为大量可用的主题、模板和插件，其中大部分是开源的（即：日历、日期/时间选择器、用于表格内容管理的插件，如以及建立在 Bootstrap 之上的库/组件集合，例如 MDB、投资组合模板、管理模板等...）
最后但同样重要的是，Bootstrap 多年来一直得到很好的维护，这使其成为生产就绪应用程序/网站的可靠选择。
于 2019-12-05T01:11:31.893 回答
0
Bootstrap 是世界上最流行和使用最广泛的开源框架，用于使用 HTML、CSS 和 JS 进行开发。它是 HTML 的前端框架。Bootstrap 有助于构建响应式网站或 Web 应用程序和 12 列网格系统，有助于将网站动态调整到合适的屏幕分辨率。当前的 bootstrap 版本是 4.3.1，并且 bootstrap 团队也正式宣布了Bootstrap 5版本以及从 bootstrap 中移除 jquery 等变化。引导框架最可取的一些关键原因是
它很容易使用
Bootstrap 有很大的社区支持
定制可以轻松完成
它提高了开发速度
响应能力
更多详情可以查看官网：https ://getbootstrap.com/
于 2019-12-05T10:59:24.537 回答
-1
Bootstrap 是开源的 HTML 框架。几乎在每个浏览器上都兼容。基本上大屏幕浏览器宽度是 >992px 和超大 1200px。因此，通过使用 Bootstrap 定义的类，我们可以调整屏幕分辨率，以便在从小手机到大屏幕的每个屏幕上显示内容。我试图解释得很简短。例如 ：
<div class="col-sm-3">....</div>
<div class="col-sm-9">....</div>
于 2021-02-03T05:01:15.753 回答