前言

通知！通知！，去我的首页转发“抽奖活动” 可以参与抽奖（一块抖音网红手表）哦。

前面文章

CSS3技术添加了许多原本利用Photoshop中处理才能实现的效果。例如文本阴影、发光效果、凸起和凹陷等。今天我们就一起学习一个新的CSS3属性，这个属性的本质是为文本添加阴影，但是通过对该属性原理的理解并加以调整，可以对文本实现更多的特效。

承接文章：

在开发中经常会使用阴影增加现实感，css3实现的模糊阴影主要分为盒阴影box-shadow和文本阴影text-shadow。今天就带大家玩转css的阴影，后面的拓展也只是抛砖引玉，希望给各位带来启迪。

一、box-shadow

该属性用来给容器添加一个或多个阴影效果。这个属性非常有用，可以结合伪类和动画实现设计的层次感和高亮度。基本语法是：

CSS3技术提供了大量增强用户界面的属性。这些属性可以对界面元素实现外观和行为上明显的调整。从本篇文章开始，小海前端（头条号）就带领小伙伴们一同学习CSS3关于增强用户界面的属性。

承接文章：

自从CSS3出来以后，各种炫酷的效果就出现了。box-shadow属性是用来创建阴影效果的。

介绍一下它的各个参数吧。

box-shadow: h-shadow v-shadow blur spread color inset;

h-shadow