Bootstrap 4 教程
Bootstrap 4 是 Bootstrap 的最新版本,它是用于开发响应式、移动优先网站的最流行的 HTML、CSS 和 JavaScript 框架。
Bootstrap 4 是完全免费下载和使用!
动手试一试示例
本 Bootstrap 4 教程包含数百个 Bootstrap 4 示例。
使用我们的在线编辑器,您可以编辑代码,并点击按钮查看结果。
Bootstrap 4 示例
<div class="jumbotron text-center">
<h1>我的第一个 Bootstrap 页面</h1>
<p>调整此响应式页面的大小以查看效果!</p>
</div>
<div class="container">
<div class="row">
<div class="col-sm-4">
<h3>列 1</h3>
<p>Lorem ipsum dolor..</p>
</div>
<div class="col-sm-4">
<h3>列 2</h3>
<p>Lorem ipsum dolor..</p>
</div>
<div class="col-sm-4">
<h3>列 3</h3>
<p>Lorem ipsum dolor..</p>
</div>
</div>
</div>
动手试一试 »点击“动手试一试”按钮查看其工作原理。
Bootstrap 5 vs. Bootstrap 3 & 4
本教程遵循 **Bootstrap 4**,该版本于 2018 年发布,是对 Bootstrap 3 的升级,具有新组件、更快的样式表、更多响应式等功能。
Bootstrap 5(于 2021 年发布)是 Bootstrap 的最新版本;它支持所有主要浏览器和平台的最新稳定版本。但是,不支持 Internet Explorer 11 及以下版本。
Bootstrap 5 和 Bootstrap 3 & 4 之间的主要区别在于,Bootstrap 5 已切换到 JavaScript 而不是 jQuery。
**注意:** Bootstrap 3 和 Bootstrap 4 仍受团队支持,用于关键错误修复和文档更改,并且可以安全地继续使用它们。但是,不会为它们添加新功能。
Bootstrap 4 基本模板
我们创建了一个使用 Bootstrap 4 的响应式启动模板。您可以自由修改、保存、共享和在项目中使用它。
我的学习
使用 W3Schools 上的免费“我的学习”程序跟踪您的进度。
登录您的帐户,开始赚取积分!
这是一个可选功能。您可以在 W3Schools 学习,而不使用“我的学习”。
Bootstrap 参考
包含所有 Bootstrap 4 CSS 类及其描述和示例的完整列表
如果您想使用 Bootstrap 组件做更多的事情,请查看我们完整的 Bootstrap 4 JavaScript/jQuery 参考 - 所有内容都包含“动手试一试”示例
Bootstrap 4 练习
Bootstrap 4 问答测试
在 W3Schools 上测试您的 Bootstrap 4 技能!