CSS阴影(立面图)
简单而有效的方法来添加阴影以创建深度/拔高效果。 阴影符合Material Design规范(24级深度)。
用法
CSS类名 | 说明 |
---|---|
no-shadow | 移除任何阴影 |
inset-shadow | 在顶部设置一个插入阴影 |
inset-shadow-down | 在底部设置一个插入阴影 |
shadow-1 | 设置1的深度 |
shadow-2 | 设置2的深度 |
shadow-N | 其中N 是1到24的整数 |
shadow-transition | 在阴影上应用默认的CSS转换效果 |
上面的阴影指向元素的底部。 如果您希望它们指向元素的顶部,请在数字前加上up
CSS类名 | 说明 |
---|---|
shadow-up-1 | 设置1的深度 |
shadow-up-2 | 设置2的深度 |
shadow-up-N | 其中N 是1到24的整数 |