|
|
|
|
@ -88,6 +88,27 @@
|
|
|
|
|
您的自定义 CSS 中需要渐变吗？只需添加 background-image: var(--bs-gradient);
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="card mt-3">
|
|
|
|
|
<div class="card-header .bg-secondary-subtle">
|
|
|
|
|
不透明度：从 v5.1.0 开始，实用程序使用 CSS 变量通过 Sass 生成。这允许实时颜色更改，而无需编译和动态 Alpha 透明度更改
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-body">
|
|
|
|
|
<h3>附加样式：style="--bs-bg-opacity: .5;"</h3>
|
|
|
|
|
<div class="bg-success p-2 text-white">这是默认的成功背景</div>
|
|
|
|
|
<div class="bg-success p-2" style="--bs-bg-opacity: .5;">这是50%不透明度的成功背景, 附加样式：style="--bs-bg-opacity: .5;"</div>
|
|
|
|
|
|
|
|
|
|
<h3>使用样式类：.bg-opacity-75 .bg-opacity-50 .bg-opacity-25 .bg-opacity-10</h3>
|
|
|
|
|
<div class="bg-success p-2 text-white">默认成功背景</div>
|
|
|
|
|
<div class="bg-success p-2 text-white bg-opacity-75">75% 不透明度的成功背景 bg-opacity-75</div>
|
|
|
|
|
<div class="bg-success p-2 text-dark bg-opacity-50">50% 不透明度的成功背景 bg-opacity-50</div>
|
|
|
|
|
<div class="bg-success p-2 text-dark bg-opacity-25">25% 不透明度的成功背景 bg-opacity-25</div>
|
|
|
|
|
<div class="bg-success p-2 text-dark bg-opacity-10">10% 不透明度的成功背景 bg-opacity-10</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-footer text-warning">
|
|
|
|
|
注意：v5.1.0 新增
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<script src="jquery/jquery-3.6.4.min.js"></script>
|
|
|
|
|
|
