Skip to main content

使用 Bootstrap 快速构建响应式网站

使用世界上最流行的前端开源工具包 Bootstrap 快速设计和定制响应式移动优先网站,支持Sass变量和混合(minxins)、响应式栅格系统、拥有众多预构建组件和强大的JavaScript插件。

当前版本 v5.1.3 · v4.6.x docs · 所有版本

安装

通过npm、Composer或Meteor安装Bootstrap的Sass资源和JavaScript文件。

包管理器安装不包括文档或我们的完整构建脚本。 您还可以使用我们的npm模板仓库快速生成Bootstrap项目。

阅读安装文档
npm install bootstrap
gem install bootstrap -v 5.1.3

jsDelivr

当我们只是需要引用编译好的Bootstrap CSS或JS时,可以使用jsDelivr

使用我们的简单入门模板查看实际效果,或查看示例以启动您的下一个项目。 您也可以选择包含Popper和分开的JS。

浏览文档
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

Bootstrap图标(Icons)

Bootstrap有史以来第一次拥有自己的开源SVG图标库,旨在更好的与我们的组件和文档一起工作。

Bootstrap图标是为Bootstrap组件而设计,但它们也适用于任何其它项目。 因为它们是SVG,因此可以轻松地快速扩展,可以通过多种方式实现,并且可以使用CSS设置样式。

获得Bootstrap图标
Bootstrap Icons

Official Themes

使用来自官方Bootstrap主题市场的高级主题将Bootstrap提升到一个新的水平。

主题构建在Bootstrap之上形成扩展框架,包含丰富的新组件和插件、文档和强大的构建工具。

浏览主题
Bootstrap Themes