Bootstrap
Bootstrap 是全球最受欢迎的前端组件库,用于开发响应式布局、移动设备优先的 WEB 项目。
Bootstrap 是一个用于 HTML、CSS 和 JS 开发的开源工具包。利用 Bootstrap 提供的 Sass 变量和混合(mixins)、响应式栅格系统、可扩展的预制组件以及强大的 jQuery 插件,能够让你快速地开发出产品原型或构建整个 app。
快速入门
是否还不知道如何快速将 Bootstrap 引入到你的项目中?使用 StackPath 支持的 BootstrapCDN 就 O 了。使用包管理工具还是下载源文件?请 前往下载页面 了解详情。
CSS 文件
将 Bootstrap 的 CSS 文件以 标签的形式添加到 标签中,并放置在所有其它样式表之前就行了。
Copy
JS 文件 Bootstrap 所提供的许多组件都依赖 JavaScript 才能运行。具体来说,这些组件都依赖 jQuery、Popper.js 以及我们自己的 JavaScript 插件。将以下我们使用的是 jQuery 的 slim(瘦身) 版本,完整版也是支持的。
Copy
是否想知道哪些组件明确的依赖 jQuery、我们自己的 JS 插件以及 Popper.js?单击下面的“显示依赖 JavaScript 的组件列表”链接了解详情。如果你对一般的页面结构还不了解,请继续了解示例页面模板。
Bootstrap 所提供的 bootstrap.bundle.js 和 bootstrap.bundle.min.js 文件中包含了 Popper,但不包含 jQuery。有关 Bootstrap 中包含了哪些内容,请参阅 内容 章节。
显示依赖 JavaScript 的组件列表
最基本的模板
请确保你的页面遵循了最新的设计和开发标准。也就是说,使用 HTML5 doctype 并包含 viewport meta 标签以实现正确的响应式行为。把这些东西攒在一起,你的页面应该是这样的:
Copy
<!doctype html>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug