DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁製作工具 >> Dreamweaver教程 >> Dreamweaver8.0教程 >> Dreamweaver8.0CSS樣式表濾鏡實例
Dreamweaver8.0CSS樣式表濾鏡實例
編輯:Dreamweaver8.0教程     

查看全套“dreamweaver8.0教程”

1、制作模糊文字效果

1、新建05.html的文件插入一個1行1列的表格,邊框和邊距全部設置為0。然後在表格中輸入要修飾的文字。

2、打開CSS樣式面板,創建一個CSS樣式,在彈出的“新建樣式對話框”做如下設置。

3、設置完成後,單擊“確定”按鈕彈出“CSS樣式定義”對話框,在類型設置區域中設置:大小:60,字體:黑體,粗細:粗,顏色:#FF9900。

4、要產生文字特效,最重要的是在擴展設置區域中進行特殊設置。

Blur濾鏡產生像被風吹一樣的模糊效果。打開濾鏡選項的下拉菜單,對Blur濾鏡進行設置:

Blur(Add=?, Direction=?, Strength=?)

Add參數是一個布爾值,一般來說,當濾鏡用於圖片時取0,用於文字時取1。

“Direction=?”模糊方向,以45度為單位改變,“0”為垂直向上,“45”向右上,“90”水平向右,“135”向右下,以依次改變。這裡我們設置Direction=90。

Strength代表模糊移動值,單位為像素。我們設置Strength=180。

設置完成後,點擊“確定”。

5、在文檔編輯區選中文字所在單元格,在屬性面板設置文字的樣式為.test。

保存文件,按F12預覽效果。

在只有HTML的時代,只能實現簡單的網頁效果。有了CSS樣式,網頁排版發生了翻天覆地的變化,在Dreamweaver8裡,使用CSS樣式是如此的簡單,而制作出來的效果可以如此的炫目。

查看全套“dreamweaver8.0教程”

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved