阴影

MDUI 提供了 24 种不同深度的阴影，可以满足 Material Design 中任意场景的需求。

相关资源

Material Design 阴影 & 层次设计规范

添加阴影

只需在元素上添加类 .mdui-shadow-[1-24]，元素就会拥有对应深度的阴影。添加类 .mdui-shadow-0 则可以移除阴影。

点击此处，并拖动页面中的滑块可以观察阴影的变化

鼠标悬浮时加深阴影

在任何元素上添加类 .mdui-hoverable，就能在鼠标悬浮时使阴影加深。

在线运行