精選幾種CSS濾鏡文字陰影效果

2024-09-05 12:21:31

字體：大中小

來源：轉載

供稿：網友

超多精選的幾種使用CSS濾鏡制作的常用陰影文字效果，相信總有一款適合您，趕快運行一下看看效果吧。

<html><head><title>CSS濾鏡陰影文字</title><style>     .abc {  line-height: 22px} .t12 { font-family:華文行楷;    font-size: 15px;     font-weight: lighter;     color: ##C3C1C1;      Filter: dropshadow(color=#ffffff,offx=1,offy=1);     TEXT-ALIGN: center;      TEXT-DECORATION: none } </style> </head><BODY BGCOLOR=#C3C1C1 style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=green,endColorStr=white);"> <TABLE WIDTH=760 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>   <TR>      <TD COLSPAN=10 class="t12">        <div align="center">|　網頁特效　|　下載排行　|　源碼分類　|      </div></TD>     <TD> </TD>   </TR> </table> <center> <TABLE><TR><TD style="FILTER: glow(color:#308148,strength=5);color: #ffffff;font-size:18px;font-family:隸書"> 與其不高興而為之，不如高興而不為之。</TD></TR></TABLE> <center><span style="color:#09ff11;font: italic 900 16pt 隸書;width: 220;filter: shadow(color=red,direction=135);">要學會依靠自己，而不是依靠別人……</span> <table bgcolor=#aaaaaa style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=green,endColorStr=white);"><tr><td style="filter:dropshadow(offX=1,offY=1,color=#000000);color:#ffffff;font-size:18px;font-family:華文行楷">中國世界<b><font color='#22FF22'>知</font><font color='#FF2222'>往</font><font color='#001199'>觀</font><font color='#00fffa'>來到我這里，寶貝！</font></b></td></tr></table> <style type="text/css">.3dfont { FILTER: glow(color=lime,strength=0) shadow(color=lime,direction:135); WIDTH: 678;font-family:隸書;font-size:16px; } </style> <center> <table border="0" width="569"><tr><td width="100%" class="3dfont"><font color="#008040">生活是承受，生活是幸福，生活是痛苦，生活是快樂！</font></td></tr></table> <table width="400" border="1" cellspacing="0" cellpadding="0" align="center" bordercolor="#999999" bgcolor="#D1D2A4"> <tr>  <td style="padding:15px;letter-spacing:3px; COLOR: #6b6c35; FILTER: dropshadow(color=#ffffcc,offx=1,offy=1);" >源碼愛好者提供精品源程序下載。</td> </tr> </table> <table width="312" height="123" border="0" cellpadding="0" cellspacing="0"> <tr> <td bgcolor="#ffdf03"><div style="filter:progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, color=black);color:orange;width:100%;font-family:華文新魏;font-size:17px;"><center>希望瀏覽此頁的人天天開心！</div></td> </tr> </table> <center>  <SPAN style="FILTER: Chroma(Color=green) glow(color:6655ff,strength=3);height:1"> <input type=button value='沖動是魔鬼！' onClick=window.open('/','_blank')  style='background-color:green;border:1px solid white;font-size:12px;color:white;height:22;'> </SPAN>   <table width="234" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" style="filter:blur(add=1,direction=135,strength=7)"> <tr> <th scope="row" style="font-family:華文行楷;font-size:18px;color:red;">歡迎您的到來！</th> </tr> </table> <table> <tr>     <td width="510"> <div style="height:1;width:100%;     font-family:impact;font-size:14pt;color:deeppink;display:block;     filter:progid:DXImageTransform.Microsoft.wave(Strength=3)">          <p align="center">你是否干的是你自己想干的活呢？</div></td>   </tr>   <tr> </table> <table>  <tr>     <td width="510"> <div style="filter:progid:DXImageTransform.Microsoft.engrave(bias=0.5);  height:1;font-size:20pt;font-family:impact;background-color:blue">          <p align="center">太陽每一天都是新的！</div></td>   </tr>    <tr>  </table> <table>   <tr>      <td style="FILTER: alpha(opacity=100,finishiopacity=0,style=1) shadow(color=blue,direction=135,strength=6)" align="center"><font color="blue" size="7" face="華文新魏">你每天都有一個舒暢的心情面對工作碼？</font></td>   </tr>   <tr>      <td style="FILTER: glow(color=#bb0909,strength=2) shadow(color=#22BB09,direction=135)" align="center"><font  color=#E1E4EC size=6 face="華文新魏"><b>不會控制自己的情緒的人是沒有度量的人！</b></font></td>   </tr>   <tr>      <td style="FILTER: glow(color=yellow,strength=4) mask(color=green) chroma(color=#B4BBCF)" align="center" height=54><font color=#fa2233 size=6 face="華文彩云"><b>心態決定成敗！ </b></font></td>   </tr> </table>  <style type="text/css"> .a1 {     font-size: 32px;     font-family: "華文行楷";     color: red;     filter: dropshadow(color=#fa00fd,offX=1,offY=1,positives=true);     height: 20px; } </style> <center> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">   <tr>     <td align="center"><div   id="iwvjtn8m0"   class="a1">性格決定命運！</div></td>   </tr> </table> </body></htm>

上一篇：幾款漂亮的CSS陰影文字

下一篇：CSS古典豎排文字