本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
方法1:使用text-shadow属性
text-shadow属性用于设置带阴影的文本;可设置阴影的像素长度、宽度和模糊的距离以及阴影的颜色。
语法:
立即学习“前端免费学习笔记(深入)”;
text-shadow: h-shadow v-shadow blur color;
属性值:
h-shadow:设置水平阴影的位置,允许负值。
v-shadow:设置垂直阴影的位置,允许负值。
blur:设置模糊的距离。
color:设置阴影的颜色。
示例:
css设置阴影效果 文本阴影!
方法2:使用box-shadow属性
box-shadow属性可以将阴影应用于文本框,可设置中阴影的像素长度,宽度和模糊的距离以及阴影的颜色。
语法:
立即学习“前端免费学习笔记(深入)”;
box-shadow: h-shadow v-shadow blur spread color inset;
属性值:
h-shadow:设置水平阴影的位置,允许负值;必需值,不可省略。
v-shadow:设置垂直阴影的位置,允许负值;必需值,不可省略。
blur:设置模糊距离;可选值,可省略。
spread:设置阴影的大小;可选值,可省略。
color:设置阴影的颜色;可选值,可省略。
inset:设置从外层的阴影(开始时)改变阴影内侧阴影;可选值,可省略。
示例:
css设置阴影效果 @@##@@
(学习视频分享:css视频教程)

