Shadow阴影
通过_sd[-*]样式类给元素独立设置阴影;在本框架中,阴影不以大小而论,而是以风格而论;比如我们可以通过阴影给元素模拟出一个边框,这模拟边框不会占用空间;再例如通过阴影模拟出一种弥漫而扩撒的效果,可以营造一种朦胧诗意的意境。
简单使用
对任意元素使用_sd
样式类即可创建浅灰色半透明阴影。
- 输出
- HTML
-
- _sd
-
关联类名
本框架定了一组阴影样式类,说明如下:
类名 | 说明 | 举例 |
---|---|---|
_sd | 普通阴影 | <div class="_sd"></div> |
_sd-lt | 浅色阴影(lt=light缩写) | - |
_sd-dk | 深色阴影(dk=dark缩写) | - |
_sd-pm | 漫射阴影(pm=permeate弥漫缩写) | - |
_sd-bd | 使用阴影制造边框 | - |
_sd-prim | prim主题阴影 | - |
_sd-error | error主题阴影 | - |
_sd-succ | succ主题阴影 | - |
_sd-info | info主题阴影 | - |
_sd-warn | warn主题阴影 | - |
_sd-issue | issue主题阴影 | - |
阴影类名有互斥性,也就是说以上类名只能对元素用一个。
- 输出
- HTML
-
- _sd
- _sd-lt
- _sd-dk
- _sd-bd
- _sd-pm
- _sd-prim
- _sd-error
- _sd-succ
- _sd-info
- _sd-warn
- _sd-issue
-