Bootstrap 5 卡片

Bootstrap 5 卡片

Bootstrap 5 是一个流行的前端框架，它提供了一套丰富的组件和工具，用于快速开发响应式和移动设备优先的网页。在 Bootstrap 5 中，卡片（Card）是一个非常重要的组件，用于展示内容，如文本、图片、列表等。卡片组件具有高度的灵活性和可定制性，可以轻松地适应不同的设计需求。

卡片的基本结构

一个基本的 Bootstrap 5 卡片由以下几个部分组成：

• 卡片容器：.card 类用于创建一个卡片容器。
• 卡片头部：.card-header 类用于创建卡片的头部，通常包含标题或操作按钮。
• 卡片主体：.card-body 类用于创建卡片的主体，可以包含文本、图片、列表等。
• 卡片底部：.card-footer 类用于创建卡片的底部，通常包含页脚信息或操作按钮。
• 卡片图片：.card-img-top 或 .card-img-bottom 类用于在卡片顶部或底部添加图片。
• 卡片标题：.card-title 类用于创建卡片的标题。
• 卡片文本：.card-text 类用于创建卡片的文本内容。
• 卡片链接：.card-link 类用于创建卡片的链接。