CSS 单边阴影
Posted ClingClang
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了CSS 单边阴影相关的知识，希望对你有一定的参考价值。
语法
box-shadow: h-shadow v-shadow blur spread color inset;box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。
box-shadow属性值-- 单边阴影
.showdow-top{ box-shadow: 0px -10px 10px -10px #333; }
.shadow-bottom{ box-shadow: 0px 10px 10px -10px #333; }
.shadow-right{ box-shadow: 10px 0px 10px -10px #333; }
.shadow-left{ box-shadow: -10px 0px 10px -10px #333; }box-shadow 配置说明
| 值 | 描述 | |
|---|---|---|
| h-shadow | 必需 | 水平阴影的位置 ,允许负值 |
| v-shadow | 必需 | 垂直阴影的位置。允许负值 |
| blur | 可选 | 阴影的尺寸 |
| spread | 可选 | 模糊距离 |
| color | 可选 | 阴影的颜色。请参阅 CSS 颜色值 |
| inset | 可选 | 将外部阴影 (outset) 改为内部阴影 |
以上是关于CSS 单边阴影的主要内容，如果未能解决你的问题，请参考以下文章