阴影
用于向 HTML 元素添加或删除阴影的工具类。
示例
在 Bootstrap 中,组件上的阴影(shadow)默认是被关闭的,但是通过开启 $enable-shadows
变量可以打开阴影效果,你还可以利用 box-shadow
工具类快速添加或删除阴影。还包括了对 .shadow-none
以及三种默认阴影尺寸(每种尺寸都有相对应的变量)的支持。
无阴影
小阴影
常规阴影
大阴影
<div class="shadow-none p-3 mb-5 bg-light rounded">无阴影</div> <div class="shadow-sm p-3 mb-5 bg-body rounded">小阴影</div> <div class="shadow p-3 mb-5 bg-body rounded">常规阴影</div> <div class="shadow-lg p-3 mb-5 bg-body rounded">大阴影</div>