CSS阴影

在CSS中使用box-shadow 属性来进行为框架进行添加阴影

默认语法

  height: 50px;
  border: 1px solid;
  box-shadow:5px 5px 5px red ; 

效果为 box-shadow：x轴值 y轴值 模糊值 颜色

值：

1. inset box-shadow属性在默认情况下为外阴影，在添加inset后为内阴影

height: 50px;
border: 1px solid;
box-shadow:inset 5px 5px 5px red ;

若为四个值则：

/* x偏移量 | y偏移量 | 阴影模糊半径 | 阴影扩散半径 | 阴影颜色 */
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);

2. olive 复数阴影

/* 任意数量的阴影，以逗号分隔 */
box-shadow: 3px 3px red, -1em 0 0.4em olive;