04-Bootstrap 弹性盒子布局(Flexbox)
深入掌握 Bootstrap 4/5 的 Flexbox 工具类,包括方向、对齐、伸缩、换行与响应式控制。
05-Bootstrap 组件系统
系统学习 Bootstrap 常用组件,包括导航、卡片、轮播、模态框、折叠、下拉菜单、徽章、进度条等。
06-Bootstrap JavaScript 插件
掌握 Bootstrap 的 Modal、Carousel、Collapse、Dropdown、Tooltip、Popover、Scrollspy 等 JavaScript 交互插件。
07-Bootstrap 实战与定制
通过 Sass 变量定制 Bootstrap 主题,并完成一个完整的企业官网响应式页面实战项目。
08-项目案例:招聘网中的简历模板
基于 Bootstrap 构建一个响应式个人简历模板,串联栅格系统、卡片、表格、折叠面板、徽章与响应式字体等核心组件。
09-项目案例:仿星巴克网站
仿照星巴克官网构建一个响应式品牌官网,重点练习轮播、卡片瀑布流、左侧固定导航、底部 Tab 切换等组件的组合应用。
10-项目案例:相册类博客项目
构建一个支持灯箱效果、选项卡分类、博客展示、联系表单的相册博客网站,覆盖导航栏、Tab、Swipebox、Popover 等组件。
11-项目案例:设计流行企业网站
使用 Bootstrap 构建一个现代化的企业宣传网站,覆盖 Hero 大图、侧边导航、服务卡片、团队展示、客户评价、联系表单等模块。
12-项目案例:Web设计与定制网站
构建一个 Web 设计与定制服务站点,包含顶部固定导航、Hero 区、团队展示、数据看板、服务卡片、博客图廊与价格套餐等模块。
13-项目案例:开发神影视频网站
构建一个视频分享网站,包含头部、轮播、分类筛选、视频网格、热门排行与底部导航等模块,重点练习轮播、徽章、列表组、彩色数字等组合。










