Bootstrap5 卡片4

简介: 在卡片组件中,使用 `.card-title` 设置标题,`.card-body` 包含正文内容,`.card-text` 用于正文标签,`.card-link` 设置链接颜色。

标题、文本和链接
我们可以在头部元素上使用 .card-title 类来设置卡片的标题 。 .card-body 类用于设置卡片正文的内容。.card-text 类用于设置卡 .card-body 类中的

标签,如果说最后一行可以移除底部边距。 .card-link 类用于给链接设置颜色。

实例

Card title

Some example text. Some example text.

Card link
Another link

尝试一下 »

相关文章
|
前端开发 程序员 Android开发
Bootstrap+jQuery实现卡片标签样式的分页
Bootstrap+jQuery实现卡片标签样式的分页
67 0
|
7月前
|
前端开发
Bootstrap 5 保姆级教程(八):卡片 & 下拉菜单
Bootstrap 5 保姆级教程(八):卡片 & 下拉菜单
|
24天前
Bootstrap5 卡片1
Bootstrap5 卡片组件通过 `.card` 和 `.card-body` 类轻松创建。
|
22天前
Bootstrap5 卡片5
图片卡片可以通过在 `<img>` 标签中添加 `.card-img-top` 或 `.card-img-bottom` 类来设置图片位置。示例代码展示了如何创建一个包含图片、标题、文本和按钮的卡片。若需将图片设为背景,可使用 `.card-img-overlay` 类。
|
23天前
|
前端开发
Bootstrap5 卡片3
Bootstrap 5 提供了多种背景颜色的卡片样式,包括基础、主要、成功、信息、警告、危险、次要、黑色和浅色卡片。通过添加相应的类(如 .bg-primary、.bg-success 等)可以轻松实现不同颜色的卡片效果。
|
23天前
Bootstrap5 卡片2
使用 `.card-header` 和 `.card-footer` 类可以分别为卡片创建头部和底部样式。
|
前端开发
开心档之 bootstrap 卡片
我们可以通过 Bootstrap4 的 .card 与 .card-body 类来创建一个简单的卡片,实例如下:
|
前端开发
bootstrap 组件之卡片总结
bootstrap 组件之卡片总结
|
JavaScript 前端开发 容器
Bootstrap-Bootstrap官网卡片响应式布局
Document .container .items{border: 1px solid #EEEEEE;padding: 10px;margin-bottom...
2030 0
N..
|
7月前
|
开发框架 前端开发 UED
Bootstrap的CSS组件
Bootstrap的CSS组件
N..
68 0