Css3中text-shadow属性使用方法及各参数所代表的含义

yumo6665个月前 (08-03)技术文章70

在CSS3中我们可以使用text-shadow属性给页面上的文字添加阴影效果,text-shadow在CSS2.1的时候曾被删除过的一个属性,但是又在css3.0中恢复了使用。

①text-shadow的使用方法:text-shadow:length length length color

  • 第一个length表示的是阴影离开文字的横向距离;
  • 第二个length表示的是阴影离开文字的纵向的距离;
  • 第三个length表示的是阴影模糊半径;

color表示的是阴影的颜色。

②位移距离:text-shadow所使用的参数中,前两个参数是阴影离开文字的横向和纵向的位移距离,使用的时候必须指定这两个参数。

③阴影的模糊半径:text-shadow属性的第三个参数就是阴影模糊半径,代表阴影向外模糊时的模糊范围。

相关文章

前端切图css高级阴影用法drop-shadow

切图网专注于html5前端切图开发,下面给大家介绍一下前端切图css高级阴影用法drop-shadow,主要是在最近项目切图中遇到的,通常我们了解的css的阴影写法就是shadow,但是它不能解决非规...

css 设置盒子阴影,阴影和背景图保持一致

预览图首先查看预览图:原理采用了 background 属性 background: inherit;inherit 关键字使得元素获取其父元素的计算值。它可以应用于任何 CSS 属性,包括 CSS...

每天一个CSS小技巧 - 不规则投影(ps不规则物体的投影怎么画)

当我们想给一个矩形或者其他能用border-radius生成的形状加投影时,box-shadow的表现都很棒的。但是,当元素添加可一些伪元素或半透明的装饰之后,border-radius会无视这些。这...

10条影响CSS渲染速度的写法与建议

1、*{} #zishu *{} 尽量避开由于不同浏览器对HTML标签的解释有差异,所以最终的网页效果在不同的浏览器中可能是不一样的,为了消除这方面的风险,设计者通常会在CSS的一个始就把所有标签的默...

CSS3新增(1)(css3新增了哪些特性)

圆角边框:在CSS3中,新增了圆角边框样式,这样我们的盒子就可以变圆角了border-radius属性用于设置元素的外边框圆角。语法:border-radius: length;盒子阴影:CSS3中新...