Effetti sul testo

Ovvero come evidenziare un testo applicando dei filtri con poche righe di codice e senza appesantire la pagina.

 

<span style="width: 100%; font-size: 24px; font-family: Old English Text MT; color: white; Filter: Blur (Add = 1, Direction = 225, Strength = 10)">IL VOSTRO TESTO QUI</span> WEBDESIGNS
   
<span style="width: 100%; font-family: Papyrus; color: white; Filter: Glow (Add = 1, Direction = 225, Strength = 10); font-weight:700">
<font size="4">
IL VOSTRO TESTO QUI </font></span>
WEBDESIGNS
   
<span style="filter: blur(add=false, direction=135, strength=6); font-size:20pt;width:200px;">IL VOSTRO TESTO QUI</span> WEBDESIGNS
   
<span style="FILTER: Glow(Color=#ffCC66, Strength=8); width:200px;font-size:20pt;">IL VOSTRO TESTO QUI</span> WEBDESIGNS
   
<span style="FILTER: DropShadow(Color=#0066CC, OffX=5, OffY=-3, Positive=1);width:300px;font-size:20pt;">IL VOSTRO TESTO QUI</span> WEBDESIGNS
   
<span style="FILTER: Shadow(Color=#00CC66, Direction=45);width:200px;font-size:20pt;">IL VOSTRO TESTO QUI</span> eFFETTO oMBRA
   
<span style="FILTER: Wave(Add=1, Freq=2, LightStrength=30, Phase=20, Strength=7); width:200px;font-size:20pt;">IL VOSTRO TESTO QUI</span> EFFETTO WAVE
   
<span style="FILTER: Xray; width:200px;font-size:20pt;background:#EEEEEE;">IL VOSTRO TESTO QUI</span> XFILTER-WEBDESIGNS
   
<span style="filter: wave(strenght=8,freq=3,lightstrenght=20,add=0,phase=90);
width:150;color:#FF0000"> <h1>
IL VOSTRO TESTO QUI</h1></span>

WEBDESIGNS

   
<span style="width:100%;text-align:center;color:magenta;font-weight:bold;font-size:30pt;filter:dropshadow(offy=2,offx=1,color=purple) shadow(direction=90,color=crimson) shadow(direction=270,color=red) shadow(direction=180,color=orangered) shadow(direction=0,color=red) wave(freq=3,phase=2,strength=4,lightstrength=25)">IL VOSTRO TESTO QUI</span> WEBDESIGNS
   
<span style="width:100%;text-align:center;font-weight:bold;font-size:35pt;color:orange;filter:alpha(style=2,opacity=100,finishopacity=30) dropshadow(color=black,offy=1,offx=2) glow(color=darkorange,strength=5) glow(color=orangered,strength=3)">IL VOSTRO TESTO QUI</span> WEBDESIGNS

 

 
<input type=button value="Button Face" style="font-family:small fonts;font-size:7pt;color:lime;font-weight:bold;height:35px;width:85px;background-color:olive;filter:alpha(style=2,opacity=100,finishopacity=0);cursor:hand">
Un normale pulsante a cui è stato applicato un filtro alpha 

   
<table align=center width=100% cellspacing=0 cellpadding=0><tr>
<td>
<marquee scrollamount=1 scrolldelay=1 direction=right width=100%>
<table align=center width=100 height=3 cellspacing=0><tr bgcolor=lime>
<td style="filter:alpha(opacity=0,finishopacity=100,style=1)"></td>
<td style="filter:alpha(opacity=100,finishopacity=0,style=1)" width=8></td>
</tr></table>
</marquee>
</td><td>
<marquee scrollamount=1 scrolldelay=1 direction=left width=100%>
<table align=center width=100 height=3 cellspacing=0><tr bgcolor=lime>
<td style="filter:alpha(opacity=0,finishopacity=100,style=1)" width=8></td>
<td style="filter:alpha(opacity=100,finishopacity=0,style=1)"></td>
</tr></table>
</marquee>
</td></tr></table>

 

Per aumentare la velocità modificare il parametro "scrollamount"

   
<span style="position:relative;text-align:center;color:black;font-family:courier;font-size:50pt;height:50pt;width:100%;filter: dropshadow(color=lime,offx=2,offy=-1) shadow(color=olive,direction=205)">IL VOSTRO TESTO QUI</span> WEBDESIGN
 
<span style="width:100%;font-weight:bold;letter-spacing:3px;color:aqua;font-size:35pt;text-align:center;height:50pt;filter: dropshadow(color=black,offy=2,offx=-1) glow(color=blue,strength=3) shadow(color=royalblue,direction=195)">IL VOSTRO TESTO QUI</span> WEBDESIGNS
<span style="width:100%;font-family:system;text-align:center;color:red;font-size:35pt;height:40pt;filter: glow(strength=5,color=yellow)">IL VOSTRO TESTO QUI</span> WEBDESIGNS

HOME