CSS 内嵌阴影

通过给 box-shadow 增加 inset 属性,可以实现内嵌阴影效果

效果

来源

CSS box-shadow 详解

语法

1
box-shadow: 0 1px 5px 2px rgba(20%, 20%, 40%, 0.5) inset;

解析

  1. 水平位移距离,必选
  2. 垂直位移距离,必选
  3. 模糊强度,不能为负
  4. 扩散强度,不能为负
  5. 阴影颜色
  6. 内阴影