测试：CSS阴影文本
<div style="color:#ffffff;margin:0px;padding:10px;font-size:60px;font-family:宋体;text-shadow:4px 4px 8px #000000;">锄禾日当午<br>
汗滴禾下土<br>
谁知盘中餐<br>
粒粒皆辛苦<br>
</div> 本帖最后由 马黑黑 于 2021-12-17 18:15 编辑
代码：
<div style="color:#ffffff;font-size:60px;font-family:宋体;text-shadow:4px 4px 8px #000000;">
锄禾日当午<br>
汗滴禾下土<br>
谁知盘中餐<br>
粒粒皆辛苦<br>
</div>
【说明】
text-shadow 是基于文本修饰的 css 样式属性，它接受如下几个参数：
① 水平阴影位置（必需）
② 垂直阴影位置（必需）
③ 模糊距离（可选）
④ 阴影的颜色（可选）
上面的 <div> 标签代码里，text-shadow属性的第一个参数和第二个参数都定义为 4px即水平和垂直阴影都是四个像素，模糊距离为8个像素，阴影颜色为 #000000 即黑色。这样，即使是纯白色文本也能清晰可辨。当然，文本阴影意在修饰，追求的是美感，文本颜色及阴影颜色的设定应根据需要选择。
有意思的是，text-shadow 属性的阴影位置支持负值。若为负值，阴影效果是往左和往上的。
代码解释 这个好玩，我来试试
<div style="color:#FB957C;font-size:60px;font-family:楷体;text-shadow:4px 4px 8px #FFC977;">红影</div> 再试试可选项如果不选会怎样
<div style="color:#FB957C;font-size:60px;font-family:楷体;text-shadow:4px 4px;">红影</div>
呀，变成带重影了，我把模糊距离拿掉就上面那样了{:4_173:} 跟着黑黑，每天都能学到新东西，真好{:4_187:} 红影 发表于 2021-12-17 20:37
跟着黑黑，每天都能学到新东西，真好
也不是每天了，偶尔 红影 发表于 2021-12-17 20:36
呀，变成带重影了，我把模糊距离拿掉就上面那样了
模糊参数虽可选，但有没有效果是不一样的 这个太好了，字体颜色会很清晰了{:4_199:} 黑黑，小辣椒明天做一个播放器试试 <div style="color:#ffffff;margin:0px;padding:10px;font-size:60px;font-family:微软雅黑;text-shadow:4px 4px 8px #000000;">
黑黑好厉害<br>
小辣椒学习<br>
</div> 这个字体相差好多
<div style="color:#ffffff;margin:0px;padding:10px;font-size:50px;font-family:宋体;text-shadow:4px 4px 8px #000000;">
黑黑好厉害<br>
小辣椒学习<br>
</div> 马黑黑 发表于 2021-12-17 20:52
也不是每天了，偶尔
当天的是学习的，剩下的时间是重影一样复习的时间，这样摊下来不就是每天么{:4_173:} 马黑黑 发表于 2021-12-17 20:53
模糊参数虽可选，但有没有效果是不一样的
嗯嗯，完全不一样，看样子这个参数省不了的。 带个板凳来学习 明天来学习！ 加林森 发表于 2021-12-17 23:18
明天来学习！
早上好 红影 发表于 2021-12-17 22:04
嗯嗯，完全不一样，看样子这个参数省不了的。
它是可选可不选，但确实有和没有有效果上的区别。这好理解：阴影理论上是颜色渐弱的，模糊达到的效果接近此诉求