Bootstrap 5 课程 – 完整分步指南 (2023)
使用最新的 Bootstrap 5 CSS 框架构建 3 个真实的项目。完成 Bootstrap 5 的深度培训
讲师:Fatah Gabrial
口袋资源独家Udemy付费课程,独家中英文字幕,配套资料齐全!
用不到1/10的价格,即可享受同样的高品质课程,且可以完全拥有,随时随地都可以任意观看和分享。
你将学到什么
- 您将学习最新的 Bootstrap v5.2 框架
- 构建Bootstrap 5 EMS前端应用程序(项目)
- 构建 Bootstrap 5 博客应用程序(项目)
- 构建 Bootstrap 5 教育网站(项目)
- 在任何网站中完成引导程序实施
- 您将学习响应式网站设计
- 您将学习构建定制的 Bootstrap 5 Web 应用程序
- 您将学习 Bootstrap 5 中的不同断点
- 您将学习如何使用 Bootstrap 5 容器
- 你将Bootstrap 5 Grid系统
- 您将学习创建响应式图像、表格和版式
- 您将学习创建定制的 Bootstrap 5 表单
- 您将学习所有 Bootstrap 5 组件,例如徽章、面包屑、按钮、按钮组、卡片等等
- 您将学习构建一个完整的基于 Bootstrap 5 的网站
要求
- 您需要了解 HTML5 和 CSS3 的基础知识
描述
(2023 年 6 月 – 更新)将 Bootstrap 部分更新为 Bootstrap 5.3
该课程现已更新为最新版本的 Bootstrap 5.3,具有深色模式、新的进度元素等。
(更新至Bootstrap 5.2)
Bootstrap是一个流行的框架,专为构建和开发响应式 Web 应用程序而设计。借助Bootstrap 5,该框架拥有更多UI 元素并配备了更高级的功能。超过一百万个网站使用 Bootstrap 及其框架进行前端开发。
在本课程中,您将从头开始学习 Bootstrap 5,直至达到高级水平。您将学习使用最新的Bootstrap 5 CSS 框架构建 3 个真实世界项目。我们将逐步浏览Bootstrap 5 文档并学习如何使用 UI 元素。
现在,在开始之前,您需要具备本课程的一些先决条件。尽管这个Bootstrap 5 课程涵盖了从头开始的所有内容。您需要一些技能才能开始。
您需要具备一些HTML5 和 CSS3技能,并且应该能够使用 HTML 和 CSS 构建一些网站。如果没有,也没关系,但您仍然需要了解一些HTML 和 CSS 基础知识。
您应该了解类和 ID在 CSS 中的工作原理,因为类和 ID 用于使用 Bootstrap 5 构建网站。确保对 CSS 类和 ID 的含义有一些基本了解。
您还需要具备一些JavaScript技能,尽管本课程对此要求不高。掌握一些JavaScript 技能仍然是个好主意。因为Bootstrap 5在其主要核心中使用JavaScript来处理 Web 交互,例如下拉菜单、模式和其他UI 元素。
因此,这就是您在整个课程中将学到的内容。
在第 1 节中,您将了解Bootstrap 5 框架是什么,并且您将了解 Bootstrap 5 Basic 网页的基本结构。
在第 2 部分中,您将了解Bootstrap 5 网格系统中的断点以及可用容器的类型,并且还将了解如何在多个设备上使用 Bootstrap 5 网格。包括网格内的操作方法栏。您将学习如何垂直和水平对齐列、换行、偏移以及重新排序。您将了解边距实用程序、装订线以及水平装订线和垂直装订线。
在第3节中,您将了解Bootstrap 5的主要内容,其中您将了解Bootstrap 5的Typography。您将学习如何在Bootstrap 5中使用图像,如何在Bootstrap 5中创建和使用表格,您还将学习如何在 Bootstrap 5 中创建和使用图形。
在第 4 节中,您将学习如何在 Bootstrap 5 中使用表单和表单元素。首先,您将学习如何使用Bootstrap 5 卡和表单控件创建基本登录表单。您将学习使用暗示自定义和内置 CSS 的方法。此外,您还将学习在 Bootstrap 5 页面中设置表单布局并设置其样式。
在第 5 节中,您将了解Bootstrap 5 中的组件。您将了解如何使用Bootstrap 5 的可忽略警报、创建徽章、在 Bootstrap 5 中使用面包屑、在 Bootstrap 5 中创建和对齐按钮和按钮组等等。
在第 6 节中,您将了解Bootstrap 5 中的帮助程序。您将了解clearfix、颜色和背景、 彩色链接、比率、位置、堆栈、视觉隐藏元素、拉伸链接、截断文本和垂直线。
在第 7 节中,您将了解Bootstrap 5 中的实用程序。这部分包括有关Bootstrap 5.2中所有可用实用程序的每个次要和主要细节
接下来,您将学习创建和自定义Bootstrap 5 卡、创建轮播、制作可折叠面板以及添加数据以使其看起来更加原始和实时。
然后您将了解下拉菜单和列表组,您将学习创建弹出模式以及在 Bootstrap 5 中创建和管理简单和复杂的导航系统。
一旦我们了解了导航系统,您将学习如何创建分页和弹出窗口。接下来,您将学习如何使用进度条和滚动间谍。
使用 Bootstrap 5 创建员工管理系统
在此项目中,您将学习如何使用 Bootstrap 5创建完整的员工管理系统或 EMS Web 应用程序。该项目将成为 EMS 应用程序的前端,其中包括登录页面、仪表板、用于创建员工数据的表单页面以及用于管理或更新员工数据的另一个表单页面,所有这些都在 Bootstrap 5 中进行。
使用Bootstrap 5构建博客应用系统
博客是互联网上最常见的东西之一。在此项目中,我们将使用 Bootstrap 5构建一个完整的博客应用程序。我们的博客应用程序将具有用于显示英雄图像的横幅部分、用于显示类别信息的卡片、用于显示有关博客的其他信息的页脚部分以及帖子和内容。页面显示各种文章。我们还将使用 Bootstrap 5表单元素创建一个评论系统。
使用 Bootstrap 5 的真实教育网站项目
当我们通过构建不同类型的项目获得Bootstrap 5 的一些高级知识时,我们将继续构建一个将在网络上运行的教育网站。
使用 Bootstrap 5构建不同类型的项目的想法是练习开发 Web 应用程序并培养Web 开发技能,以掌握使用 Bootstrap 5 进行 Web 的前端开发。
我希望你们会喜欢这门课程,我们课堂见。
本课程适合谁:
- 任何有兴趣学习 Bootstrap 5 的人
- 任何想成为网页设计师的人
- 任何想成为网络开发人员的人
- 任何想学习响应式网页设计的人