0
点赞
收藏
分享

微信扫一扫

text-shadow看了必回的CSS操作!


一看到text-shadow都会眼熟,虽然正式开发用的少,但是都知道这个是文字投影的功能,其效果大家都明白,不废话,就啰嗦一个文字模糊的功能,具体的看:案例二。

一.CSS公式

text-shadow: A B C color;

  • A:水平偏移量,允许是负值
  • B:垂直偏移量,允许是负值
  • C:blur,模糊度
  • color:模糊色值

二、实战应用:

1.为文字添加投影;

.box1{color: #111;text-shadow: #111 0 0 5px;} 



text-shadow看了必回的CSS操作!_html


2.实现文字模糊效果;

.box2{color: transparent;text-shadow: #111 0 0 5px;} 



text-shadow看了必回的CSS操作!_css_02


二者区别在于文字是否透明,文字颜色透明就是没有颜色,那就仅剩下投影层,就实现了文字模糊效果,当然你也可以用滤镜实现文字模糊效果:filter:blur(5px)。

三、浏览器兼容性



text-shadow看了必回的CSS操作!_html_03



举报

相关推荐

0 条评论