作者：馮永曜

對一個對象使用“glow”濾鏡后，這個對象的邊緣就會產生類似發光的效果，這種效果在PHTOSHOP中做起來都比較麻煩，而在DW3中用CSS的“glow”濾鏡來制作卻是如此地簡單，而且節約不少字節。
　　“glow”濾鏡只有兩個參數，一個是“color”是指定發光的顏色，可用十六進制的顏色代碼來設定，如#FF0000（表示紅色）；另一個參數是“strength”則是表示發光的強度，可以從1到255之間的任何整數來指定這個發光強度，也可簡單地理解為光芒的長度。下面我們來做幾個應用實例。

一、發光的文字
　　請看下面的效果圖：

　　圖1　“glow”濾鏡加載到文字上的效果

　　上面這種效果不錯吧？！制作“glow”濾鏡與其它CSS濾鏡在方法上沒有什么區別，故不再重復。“glow”濾鏡可以直接加載到文字上，所以使用非常方便。上面這種效果的濾鏡代碼是：Glow1(Color=#0000FF, Strength=7)，你對“Color"和“Strength”設置不同的值，將得到不同的效果，你可以動手試試。

二、給圖片加漸變外框
　　“glow”濾鏡加載到一般圖片無效，但若是把圖片放到表格中，再給表格的< td >加上“glow”濾鏡，卻能使圖片產生一個漸變顏色的邊框，請看下面的效果：

　　圖2　在< td >上加載“glow”濾鏡的效果

　　這里使用的“glow”濾鏡代碼是：Glow1(Color=#0000FF, Strength=7)。但請你在具體制作時注意：為了加強效果，可以加上背景色，但你只能給表格加背景色，而一旦你給單元格加上背景色，“glow”濾鏡就無效了。

三、為透明背景的圖片增色
　　“glow”濾鏡加載到一般圖片上無效，但加載到有透明背景的gif圖片上卻能產生一種光暈效果，請看下面的效果圖：

　　圖3　“glow”濾鏡加載到透明背景圖片上的效果

　　在透明的gif 圖片上可以直接加載“glow”濾鏡，也就是用鼠標點擊一下圖片，然后，點擊快速啟動欄上的CSS圖標，在對話框中選擇一個“glow”濾鏡即可。本例的“glow”濾鏡代碼是Glow1(Color=#CCFF99, Strength=7)。
　　“glow”濾鏡的參數不多，使用也就比較簡單，在具體應用時關鍵的問題是光芒顏色的選擇，原則是與整個頁面色彩要協調。我們再來看看在上例中再給< td >加載一個“glow”濾鏡，代碼為Glow2(Color=#0000FF, Strength=7)，將獲得如下圖所示的效果：

　　圖4　兩次加載濾鏡的效果

　　這種效果有點酷吧？！此時你在網頁的源代碼< head >與< /head >可看到這樣一些代碼：
　　< style type="text/css" >
　　< !--
　　　.glow1 { filter: Glow(Color:#CCFF99, Strength:7) }
　　　.glow2 { filter: Glow(Color:#0000FF, Strength:7) }
　　-- >
　　< /style >
　　而在< td >的代碼是這樣的：< td class="glow2 glow1" > 。這就給我們一個啟示，多次加載“Glow”濾鏡可產生一些奇特的效果，如制作發生日蝕時太陽的圖片，火焰文字效果等等，這完全取決于你的創意。

總結

以上是生活随笔為你收集整理的巧用CSS的Glow滤镜的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。