Efectos en textos e imágenes con CSS

En este artículo veremos como aplicar filtros CSS en textos e imágenes para lograr determinados efectos.

Sólo debes copiar el código del efecto que quieras utilizar e insertarlo dentro en tu página web. También puedes cambiar los parámetros del filtro para obtener un nuevo efecto, o bien, modificarlo a gusto propio.

Código:
<span style="color:#FFFFFF;width:100%; filter:dropshadow(color=#000000,offx=1, offy=1, positive=1), glow(color=#000000, strength=0)">Efecto borde: Drop Shadow con Glow</span>

Código:
<span style="color:#FFFFFF;height:1; filter:glow(color=#000000)">Efecto Glow</span>

Código:
<span style="height:1; Filter: Blur(Direction=200, Strength=4)">Efecto Motion Blur</span>

Código:
<span style="height:1; filter:shadow(color=#666666, direction=230, enabled=1)">Efecto Drop Shadow</span>

Código:
<span style="height:1; Filter: DropShadow(Color=#666666, OffX=2, OffY=2, Positive=1)">Efecto Drop Shadow 2</span>

Código:
<span style=" height=1; Filter: Mask(Color=#000000)">Efecto fondo (Mask)</span>

Código:
<span style="height:50; Filter: Wave(Freq=4, Phase=100, Strength=2)">Efecto Wave</span>

Código:
<span style="width: 357; height: 50; Filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=0, StartY=0, FinishX=580, FinishY=0)"><b>Efecto Alpha</b></span>

Usuarios que han visto este tema también han visto...

- Menú con efecto onmouseover con CSS
- Guia basica de hojas de estilo
- Decorar un campo select de formulario con CSS
- Fondo para campos textarea en CSS
- Los medios de CSS

- Versión imprimible de este documento
- Enviar por e-mail este documento