Bootstrap 入门 — 响应式 CSS 框架
Bootstrap:最流行 CSS 框架,栅格+组件+工具类 · 难度:入门 · +20XP
Bootstrap 是什么?
Bootstrap 是 Twitter 推出的CSS 框架,提供预制的样式和组件。引入一个 CSS 文件就能用。
Bootstrap 三大核心
| 功能 | 说明 |
|---|---|
| 📐 栅格系统 | 12 列响应式布局,自动适配手机/平板/桌面 |
| 🧩 组件 | 按钮、卡片、导航、模态框、表单等开箱即用 |
| 🎨 工具类 | 间距(mt-3)、颜色(text-primary)、边框等直接用类名 |
快速开始
<link href="bootstrap.min.css">
<div class="container"><div class="row"><div class="col">内容</div></div></div>
学习与实践建议
- 先理解本节的核心概念和语法规则
- 在右边编辑器中修改示例代码,观察运行结果变化
- 尝试用学到的知识完成一个小练习——比如自己写一个工具函数或小程序
- 遇到问题时,查阅官方文档是最快的学习途径
编程是门实践技能,动手写代码比看教程重要得多。坚持每天练习,你会很快看到进步!