css三个方向阴影 |css 获取第一个a标签

.shadow {
/* 上方阴影：x轴偏移0，y轴偏移-5px，模糊程度5px，扩散程度0，颜色黑色 */
box-shadow: 0 -5px 5px 0 black;
}

上面的代码实现了一个向上偏移的阴影效果，其中x轴偏移为0px，y轴偏移为-5px，阴影模糊程度为5px，扩散程度为0，颜色为黑色。

.shadow {
/* 右方阴影：x轴偏移5px，y轴偏移0，模糊程度5px，扩散程度0，颜色黑色 */
box-shadow: 5px 0 5px 0 black;
}

上面的代码实现了一个向右侧偏移的阴影效果，其中x轴偏移为5px，y轴偏移为0px，阴影模糊程度为5px，扩散程度为0，颜色为黑色。

.shadow {
/* 下方阴影：x轴偏移0，y轴偏移5px，模糊程度5px，扩散程度0，颜色黑色 */
box-shadow: 0 5px 5px 0 black;
}

上面的代码实现了一个向下偏移的阴影效果，其中x轴偏移为0px，y轴偏移为5px，阴影模糊程度为5px，扩散程度为0，颜色为黑色。

通过以上方式，大家可以轻松实现三个方向的阴影效果。除了上述的参数设置外，大家也可以在属性值中添加多个阴影效果以实现更加丰富的效果。例如：

.shadow {
/* 上方和下方阴影：x轴偏移0，模糊程度5px，扩散程度0，上方y轴偏移-5px、颜色灰色，下方y轴偏移5px、颜色白色 */
box-shadow: 0 -5px 5px 0 gray, 0 5px 5px 0 white;
}

上面的代码实现了一个同时具有上下两个方向阴影的效果，其中上方阴影的颜色为灰色，y轴偏移为-5px，下方阴影的颜色为白色，y轴偏移为5px。