AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

Bootstrap5 卡片3

2024-11-13 4
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： Bootstrap 5 提供了多种背景颜色的卡片样式，包括基础、主要、成功、信息、警告、危险、次要、黑色和浅色卡片。通过添加相应的类（如 .bg-primary、.bg-success 等）可以轻松实现不同颜色的卡片效果。

多种颜色卡片
Bootstrap 5 提供了多种卡片的背景颜色类： .bg-primary, .bg-success, .bg-info, .bg-warning, .bg-danger, .bg-secondary, .bg-dark 和 .bg-light。

实例


多种颜色卡片



基础卡片





主要卡片





成功卡片





信息卡片





警告卡片





危险卡片





次要卡片





黑色卡片





浅色卡片


文章标签：
前端开发
关键词：
Bootstrap卡片
游客ogeeqvh5vfa5q
目录
相关文章
游客ogeeqvh5vfa5q
|
1天前
Bootstrap5 卡片4
在卡片组件中，使用 `.card-title` 设置标题，`.card-body` 包含正文内容，`.card-text` 用于正文标签，`.card-link` 设置链接颜色。
游客ogeeqvh5vfa5q
10 2
游客ogeeqvh5vfa5q
|
1天前
Bootstrap5 卡片1
Bootstrap5 卡片组件通过 `.card` 和 `.card-body` 类轻松创建。
游客ogeeqvh5vfa5q
13 2
游客ogeeqvh5vfa5q
|
1天前
Bootstrap5 卡片2
使用 `.card-header` 和 `.card-footer` 类可以分别为卡片创建头部和底部样式。
游客ogeeqvh5vfa5q
5 0
N..
|
6月前
|
开发框架 前端开发 UED
bootstrap导航
bootstrap导航
N..
49 0
游客ruqdfvh2iuyqc
|
前端开发
bootstrap 组件之卡片总结
bootstrap 组件之卡片总结
游客ruqdfvh2iuyqc
130 0
程序员大阳
|
前端开发
Bootstrap教程(12)--使用图标
本文目录 1. 背景 2. 使用Glyphicon图标 3. 结合按钮使用 4. 小结
程序员大阳
247 0
Bootstrap教程(12)--使用图标
程序员大阳
|
前端开发 JavaScript
Bootstrap教程(26)–轮播的实现
本文目录 1. 概述 2. 基本轮播 3. 添加轮播指示器 4. 添加轮播控件 5. 小结
程序员大阳
249 0
Bootstrap教程(26)–轮播的实现
学堂小助手
|
开发框架 前端开发 开发者
27_Bootstrap 组件_导航条2 | 学习笔记
快速学习 27_Bootstrap 组件_导航条2
学堂小助手
99 0
学堂小助手
|
开发框架 前端开发 开发者
Bootstrap 组件_按钮式下拉菜单 | 学习笔记
快速学习 Bootstrap 组件_按钮式下拉菜单
学堂小助手
171 0
学堂小助手
|
开发框架 前端开发 JavaScript
Bootstrap 组件_下拉菜单|学习笔记
快速学习 Bootstrap 组件_下拉菜单
学堂小助手
137 0