Bootstrap 4 中的隐藏阴影

在 Bootstrap 4 中，阴影默认为开启状态，但有时可能需要隐藏阴影。以下是实现此目的的方法。

方法一：使用 shadow-none 类

在需要隐藏阴影的元素中添加 shadow-none 类即可。

<div class="card shadow-none">
  <!-- Card content -->
</div>

方法二：使用自定义样式

您可以使用自定义 CSS 样式来覆盖默认的阴影样式。以下样式将隐藏卡片元素的阴影：

.card {
  box-shadow: none;
}

方法三：使用 SASS 变量

如果您使用 SASS 来构建您的样式表，则可以使用 $card-shadow 变量来控制卡片元素的阴影。将其设置为 none 将隐藏阴影：

$card-shadow: none;

需要注意的一点是，重置 $card-shadow 变量应该在 Bootstrap 样式表之前，以确保其生效。

结论

以上是在 Bootstrap 4 中隐藏阴影的三种方法。您可以根据您的喜好和项目需求选择其中的一种方法进行实现。