使用 card-link 类为卡片中的任何链接添加悬停效果和蓝色。以下代码片段显示了三个使用 Bootstrap 4 中的 card-link 类添加悬停效果的链接： 网站开发 应用开发（iOS） 应用开发（Android） 尝试以下代码以实现 card-link 类：示例在线演示 Bootstrap 示例 服务 公司 我们提供以下技术开发服务： 网站开发 应用开发（iOS） 应用开发（Android）

要为 Bootstrap 4 卡片设置浅灰色背景，请使用 bg-light 类。像 Bootstrap 中的其他任何类一样使用“card bg-light”： 图片编辑器 上述代码为 Bootstrap 卡片提供了浅灰色背景。让我们看一个 card-light 类的示例：示例在线演示 Bootstrap 示例 网络工具 图片编辑器 图片优化器

在 Bootstrap 中使用 float-right 类将元素放置在右侧。默认文本对齐方式位于左侧，使用 float-right 类将文本对齐到右侧，如以下代码片段所示： 此文本位于右侧。它也可以用于任何其他元素，例如， 、 、 等： 在右侧 您可以尝试运行以下代码以实现 float-right 类：示例在线演示 Bootstrap 示例 示例 此文本位于右侧。 此文本位于左侧。 浮动移除

要将收集的项目从起始位置对齐，请在 Bootstrap 4 中使用 .align-content-start 类。设置项目如下所示： 工作 1 工作 2 工作 3 工作 4 工作 5 工作 6 您可以尝试运行以下代码以在 Bootstrap 4 中实现 align-content-start：示例在线演示 Bootstrap 示例 对齐弹性项目 工作 1 工作 2 工作 3 工作 4 工作 5 工作 6 工作 7 工作 8 工作 9 工作 10 工作 11 工作 12 工作 13 工作 14

在 Bootsrap 4 中使用 btn-outline-light 类设置浅灰色轮廓按钮。要在网页上包含它，请将其设置为元素中的类，如以下代码片段所示：让我们看一个实现 btn-outline-light 类的示例：示例在线演示 Bootstrap 示例 演示按钮 下面是一个浅灰色的轮廓按钮： 示例

要设置蓝色轮廓 Bootstrap 4 按钮，请使用 .btn-outline-primary 类。为按钮添加蓝色轮廓： 蓝色轮廓 您可以尝试运行以下代码以在 Bootstrap 中实现 btn-outline-primary 类：示例在线演示 Bootstrap 示例 Bootstrap 4 您可以在下面看到蓝色轮廓： 蓝色轮廓

使用 card-header 类创建 Bootstrap 卡片标题： 这是标题 在包含卡片标题后，您可以添加卡片主体和页脚，如以下代码片段所示： 这是演示内容。 这是页脚。 您可以尝试运行以下代码以在 Bootstrap 4 中实现 card-header 类：示例在线演示 Bootstrap 示例 演示标题 这是标题 这是演示内容。 这是页脚

要跨 Bootstrap 4 中的不同屏幕拉伸弹性项目，请使用 .align-self-*-stretch 类。要在不同屏幕上进行拉伸，您需要使用 align-self-sm-stretch、align-self-md-stretch、align-self-lg-stretch 等。以下是针对小屏幕尺寸的示例： A-one B-one C-one D-one 您可以尝试运行以下代码以跨不同屏幕尺寸拉伸弹性项目：示例在线演示 Bootstrap 示例 对齐特定弹性项目并拉伸 A-one B-one C-one D-one 小屏幕尺寸 A-one B-one C-one D-one 中等屏幕尺寸 A-one B-one C-one D-one 大屏幕尺寸 A-one B-one C-one D-one

在 Bootstrap 中使用 float-none 类从元素中移除浮动。文本的默认值始终为左对齐；因此，移除浮动会将文本放置在左侧：您可以尝试运行以下代码以从元素中移除浮动：示例在线演示 Bootstrap 示例 演示 此文本位于左侧（在小屏幕上）。 此文本位于左侧（在中等屏幕上）。 此文本位于左侧（浮动移除）。 此文本位于左侧（在超大屏幕上）。 此文本位于左侧（浮动移除）。

在 Bootsrap 4 中使用 btn-outline-danger 类使用红色轮廓按钮指示危险。以下是如何设置一个使用红色轮廓指示危险的按钮的示例： 危险 该类使用 Bootstrap 中的 btn 和 btn-outline-danger 类添加：class="btn btn-outline-danger”让我们看一个实现 btn-outline-danger 类的示例：示例在线演示 Bootstrap 示例 动物 动物处于危险之中。要了解原因，您需要点击以下内容： 危险