DW里CSS的詳細(xì)介紹_第1頁
DW里CSS的詳細(xì)介紹_第2頁
DW里CSS的詳細(xì)介紹_第3頁
DW里CSS的詳細(xì)介紹_第4頁
DW里CSS的詳細(xì)介紹_第5頁
已閱讀5頁,還剩22頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認(rèn)領(lǐng)

文檔簡介

1/1DW里CSS的詳細(xì)介紹DW里CSS的詳細(xì)介紹創(chuàng)建CSS樣式表的過程,就是對各種CSS屬性的配置過程,所以了解和掌控屬性配置很重要。

在DWMX2004的CSS樣式里包含了W3C規(guī)范定義的任何CSS1的屬性,把這些屬性分為:

類型、背景、區(qū)塊、方框、邊框、列表、定位、擴展等八個部分,如下圖:

DWMX2004實現(xiàn)CSS屬性配置功能是完全可視化的,無需編寫代碼。

下面我們分別周詳講解。

為了便于理解,從開始創(chuàng)建新的CSS樣式表說起:

注:

您需對DWMX2004程式初步了解,并打開他對照本教程進行學(xué)習(xí)。

假如您對DWMX2004尚不熟悉,請瀏覽【DWMX2004簡體中文版入門教程】。

【創(chuàng)建新的CSS樣式】將插入點放在文檔中,然后執(zhí)行以下操作之一打開新建CSS樣式對話框:

在CSS樣式面板(窗口CSS樣式)中,單擊面板右下角區(qū)域中的新建CSS樣式按鈕,如下圖:

在文本屬性檢查器中,從樣式彈出式菜單中選擇管理樣式,然后在出現(xiàn)的對話框中單擊新建。

在相關(guān)CSS選項卡(選擇窗口標(biāo)簽檢查器,然后單擊相關(guān)CSS選項卡)中右鍵單擊,然后從上下文菜單中選擇新建規(guī)則。

選擇文本菜單CSS樣式新建(N)。

新建CSS樣式對話框隨即出現(xiàn),如下圖:

定義您要創(chuàng)建的CSS樣式的類型:

若要創(chuàng)建可作為class屬性應(yīng)用于文本范圍或文本塊的自定義樣式,請選擇創(chuàng)建自定義樣式(Class),然后在名稱文本框中輸入樣式名稱。

注意:

類名稱必須以句點開頭,并且能夠包含任何字母和數(shù)字組合(例如,.mycss)。

假如您沒有輸入開頭的句點,DWMX2004將自動為您輸入。

若要重定義特定HTML標(biāo)簽的默認(rèn)格式,請選擇重定義標(biāo)簽,然后在標(biāo)簽字段中輸入一個HTML標(biāo)簽,或從彈出式菜單中選擇一個標(biāo)簽。

若要為具體某個標(biāo)簽組合或任何包含特定Id屬性的標(biāo)簽定義格式,請選擇使用CSS選擇器,然后在選擇器文本框中輸入一個或多個HTML標(biāo)簽,或從彈出式菜單中選擇一個標(biāo)簽。

彈出式菜單中提供的選擇器(稱作偽類選擇器)包括a:active、a:hover、a:link和a:visited。

選擇定義樣式的位置:

若要創(chuàng)建外部樣式表,請選擇新建樣式表文檔。

若要在當(dāng)前文檔中嵌入樣式,請選擇僅對該文檔。

單擊確定。

類型屬性【定義CSS類型屬性】使用CSS樣式定義對話框中的類型類別能夠定義CSS樣式的基本字體和類型配置。

定義CSS樣式的類型配置:

在CSS樣式定義對話框中,選擇類型(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

字體:

為樣式配置字體。

DWMX2004內(nèi)置6個系列的英文字體(如下圖)。

一般英文字體常常用Arial,Helvetica,sans-serif這個系列比較美觀,假如不用這些字體系列,您您能夠通過下拉列表最下面的編輯字體列表來創(chuàng)建新的字體系列。

中文網(wǎng)頁默認(rèn)字體是宋體,一般留空即可。

瀏覽器最好選擇用戶系統(tǒng)第一種字體顯示文本。

兩種瀏覽器都支持字體屬性。

大?。?/p>

定義文本大小。

能夠通過選擇數(shù)字和度量單位選擇特定的大小,也能夠選擇相對大小。

以像素為單位能夠有效地防止瀏覽器變形文本。

提示:

CSS中長度的單位分絕對長度單位和相對長度單位:

絕對長度相對長度px:

(象素)根據(jù)顯示器的分辨率來確定長度。

pt:

(字號)根據(jù)windows系統(tǒng)定義的字號大小來確定長度。

in、cn、mm:

(英寸、厘米、毫米)根據(jù)顯示的實際尺寸來確定長度。

此類單位不隨顯示器的分辨率改變而改變。

em:

當(dāng)前文本的尺寸。

例如:

{font-size:2em}是指文字大小為原來的2倍。

ex:

當(dāng)前字母x的高度,一般為字體尺寸的一半。

%:

是以當(dāng)前文本的百分比定義尺寸。

例如:

{font-size:300%}是指文字大小為原來的3倍。

兩種瀏覽器都支持大小屬性。

o樣式:

將正常、斜體或偏斜體指定為字體樣式。

默認(rèn)配置是正常。

兩種瀏覽器都支持樣式屬性。

o行高:

配置文本所在行的高度。

選擇正常自動計算字體大小的行高,或輸入一個確切的值并選擇一種度量單位。

比較直觀的寫法用百分比,例如180%是指行高等于文字大小的1.8倍。

相對應(yīng)的CSS屬性是line-height。

兩種瀏覽器都支持行高屬性。

o修飾:

向文本中添加下劃線、上劃線或刪除線,或使文本閃爍。

正常文本的默認(rèn)配置是無。

鏈接的默認(rèn)配置是下劃線。

將鏈接配置設(shè)為無時,能夠通過定義一個特別的類刪除鏈接中的下劃線。

這些效果能夠同時存在,將效果前的復(fù)選框選定即可。

相對應(yīng)的CSS屬性是text-decoration。

兩種瀏覽器都支持修飾屬性。

o粗細(xì):

對字體應(yīng)用特定或相對的粗體量。

正常等于400;粗體等于700。

相對應(yīng)的CSS屬性是font-weight。

兩種瀏覽器都支持粗細(xì)屬性。

o變量:

配置文本的小型大寫字母變量。

DWMX2004不在文檔窗口中顯示該屬性。

InternetExplorer支持變量屬性,但NetscapeNavigator不支持。

o大小寫:

將選定內(nèi)容中的每個單詞的首字母大寫或?qū)⑽谋九渲脼槿看髮懟蛐憽?/p>

兩種瀏覽器都支持大小寫屬性。

o顏色:

配置文本顏色。

兩種瀏覽器都支持顏色屬性。

配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

背景屬性【定義CSS樣式背景屬性】使用CSS樣式定義對話框的背景類別能夠定義CSS樣式的背景配置。

能夠?qū)W(wǎng)頁中的任何元素應(yīng)用背景屬性。

例如,創(chuàng)建一個樣式,將背景顏色或背景圖像添加到任何頁面元素中,比如在文本、表格、頁面等的后面。

還能夠配置背景圖像的位置。

提示:

本頁背景圖片固定,是【定義CSS樣式背景屬性】的效果。

定義背景配置:

在CSS樣式定義對話框中,選擇背景(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

背景顏色:

配置元素的背景顏色。

兩種瀏覽器都支持背景顏色屬性。

背景圖像:

配置元素的背景圖像。

兩種瀏覽器都支持背景圖像屬性。

重復(fù):

定義是否重復(fù)連同怎樣重復(fù)背景圖像。

兩種瀏覽器都支持重復(fù)屬性。

o不重復(fù)在元素開始處顯示一次圖像。

o重復(fù)在元素的后面水平和垂直平鋪圖像。

o橫向重復(fù)和縱向重復(fù)分別顯示圖像水平帶區(qū)和垂直帶區(qū)。

圖像被剪輯以適合元素的邊界。

附件:

確定背景圖像是固定在他的原始位置還是隨內(nèi)容一起滾動。

注意,某些瀏覽器可能將固定選項視為滾動。

InternetExplorer支持該選項,但NetscapeNavigator不支持。

水平位置:

和垂直位置指定背景圖像相對于元素的初始位置。

這能夠用于將背景圖像和頁面中央垂直和水平對齊。

假如附件屬性為固定,則位置相對于文檔窗口而不是元素。

InternetExplorer支持該屬性,但NetscapeNavigator不支持。

配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

區(qū)塊屬性【定義CSS樣式區(qū)塊屬性】使用CSS樣式定義對話框的區(qū)塊類別能夠定義標(biāo)簽和屬性的間距和對齊配置。

下列兩組表格為文本定義區(qū)塊屬性前后對比:

原文本未定義區(qū)塊屬性【定義CSS樣式區(qū)塊屬性】定義區(qū)塊屬性后效果【定義CSS樣式區(qū)塊屬性】原文本未定義區(qū)塊使用樣式定義對話框的區(qū)塊類別能夠定義標(biāo)簽和屬性的間距和對齊配置。

此為區(qū)塊定義演示。

字間的空格可不是用鍵盤敲出來的。

定義區(qū)塊后效果(參數(shù)見下圖)使用樣式定義對話框的區(qū)塊類別能夠定義標(biāo)簽和屬性的間距和對齊配置。

此為區(qū)塊定義演示。

字間的空格可不是用鍵盤敲出來的。

定義區(qū)塊配置:

在CSS樣式定義對話框中,選擇區(qū)塊(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

單詞間距:

配置單詞的間距。

若要配置特定的值,請在彈出式菜單中選擇值,然后輸入一個數(shù)值。

在第二個彈出式菜單中,選擇度量單位。

注意:

能夠指定負(fù)值,但顯示取決于瀏覽器。

Dreamweaver不在文檔窗口中顯示該屬性。

字母間距:

增加或減小字母或字符的間距。

若要減少字符間距,請指定一個負(fù)值(例如-4)。

字母間距配置覆蓋對齊的文本配置。

InternetExplorer4和更高版本連同NetscapeNavigator6支持字母間距屬性。

垂直對齊:

指定應(yīng)用他的元素的垂直對齊方式。

僅當(dāng)應(yīng)用于img標(biāo)簽時,Dreamweaver才在文檔窗口中顯示該屬性。

文本對齊:

配置元素中的文本對齊方式。

兩種瀏覽器都支持文本對齊屬性。

文本縮進:

指定第一行文本縮進的程度。

能夠使用負(fù)值創(chuàng)建凸出,但顯示取決于瀏覽器。

僅當(dāng)標(biāo)簽應(yīng)用于塊級元素時,Dreamweaver才在文檔窗口中顯示該屬性。

兩種瀏覽器都支持文本縮進屬性。

空格:

確定怎樣處理元素中的空白。

從下面三個選項中選擇:

正常收縮空白;保留的處理方式即保留任何空白,包括空格、制表符和回車;不換行指定僅當(dāng)碰到br標(biāo)簽時文本才換行。

Dreamweaver不在文檔窗口中顯示該屬性。

NetscapeNavigator和InternetExplorer5.5支持空格屬性。

顯示:

指定是否顯示連同怎樣顯示元素。

無關(guān)閉他被指定給的元素的顯示。

配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

方框?qū)傩浴径xCSS樣式方框?qū)傩浴渴褂肅SS樣式定義對話框的方框(又稱盒子)類別能夠為控制元素在頁面上的放置方式的標(biāo)簽和屬性定義配置。

能夠在應(yīng)用填充和邊距配置時將配置應(yīng)用于元素的各個邊,也能夠使用全部相同配置將相同的配置應(yīng)用于元素的任何邊。

定義元素在頁面上的放置方式:

在CSS樣式定義對話框中,選擇方框(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

寬和高:

配置元素的寬度和高度。

寬和高定義的對象多為圖片,表格,層等。

浮動:

配置元素浮動方式(如文本、層、表格等)。

其他元素按通常的方式環(huán)繞在浮動元素的周圍。

兩種瀏覽器都支持浮動屬性。

這是配置浮動效果的演示。

定義表格浮動(左對齊),文本自動排列在該表格的右側(cè)。

清除:

不允許元素的浮動。

左對齊:

表示不允許左邊有浮動對象。

右對齊:

表示不允許右邊有浮動對象。

兩者:

表示允許兩邊都能夠有浮動對象。

無:

不允許有浮動對象。

兩種瀏覽器都支持清除屬性。

填充:

指定元素內(nèi)容和元素邊框(假如沒有邊框,則為邊距)之間的間距。

取消選擇全部相同選項可配置元素各個邊的填充。

全部相同:

將相同的填充屬性配置為他應(yīng)用于的元素的上、右、下和左側(cè)。

邊界:

指定一個元素的邊框(假如沒有邊框,則為填充)和另一個元素之間的間距。

僅當(dāng)應(yīng)用于塊級元素(段落、標(biāo)題、列表等)時,DWMX2004才在文檔窗口中顯示該屬性。

取消選擇全部相同可配置元素各個邊的邊距。

全部相同:

將相同的邊距屬性配置為他應(yīng)用于的元素的上、右、下和左側(cè)。

配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

邊框?qū)傩浴径xCSS樣式邊框?qū)傩浴渴褂肅SS樣式定義對話框的邊框類別能夠定義元素周圍的邊框的配置(如寬度、顏色和樣式)。

提示:

本頁為邊框進行了配置(樣式:

點劃線寬度:

2px顏色:

#FF0000)配置邊框樣式:

在CSS樣式定義對話框中,選擇邊框(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

樣式:

配置邊框的樣式外觀。

樣式的顯示方式取決于瀏覽器。

DWMX2004在文檔窗口中將任何樣式呈現(xiàn)為實線。

兩種瀏覽器都支持樣式屬性。

取消選擇全部相同可配置元素各個邊的邊框樣式。

全部相同:

將相同的邊框樣式屬性配置應(yīng)用于的元素的上、右、下和左側(cè)。

寬度:

配置元素邊框的粗細(xì)。

兩種瀏覽器都支持寬度屬性。

取消選擇全部相同可配置元素各個邊的邊框?qū)挾取?/p>

全部相同:

將相同的邊框?qū)挾扰渲脩?yīng)用于的元素的上、右、下和左側(cè)。

顏色:

配置邊框的顏色。

能夠分別配置每個邊的顏色,但顯示取決于瀏覽器。

取消選擇全部相同可配置元素各個邊的邊框顏色。

全部相同:

將相同的邊框顏色配置應(yīng)用于的元素的上、右、下和左側(cè)。

配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

列表屬性【定義CSS樣式列表屬性】CSS樣式定義對話框的列表類別為列表標(biāo)簽定義列表配置(如項目符號大小和類型)。

定義列表樣式:

在CSS樣式定義對話框中,選擇列表(如下圖),然后選擇所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

o類型:

配置項目符號或編號的外觀。

兩種瀏覽器都支持類型。

o項目符號圖像:

能夠為項目符號指定自定義圖像。

單擊瀏覽選擇圖像或鍵入圖像的路徑。

o位置:

配置列表項文本是否換行和縮進連同文本是否換行到左邊距。

列表屬性配置應(yīng)用舉例如下:

圓點符號數(shù)字編號圖像符號CSS樣式表屬性分為:

類型;背景;區(qū)塊;方框;邊框;列表;定位;擴展;CSS樣式表屬性分為:

9.類型;10.背景;11.區(qū)塊;12.方框;13.邊框;14.列表;CSS樣式表屬性分為:

類型;背景;區(qū)塊;方框;邊框;列表;定位;擴展;15.定位;16.擴展;配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

定位屬性【定義CSS樣式定位屬性】定位樣式屬性使用層最好選擇參數(shù)中定義層的默認(rèn)標(biāo)簽,將標(biāo)簽或所選文本塊更改為新層。

配置層定位屬性:

在CSS樣式定義對話框中,選擇定位(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

類型:

確定瀏覽器應(yīng)怎樣來定位層。

絕對:

使用定位框中輸入的坐標(biāo)(相對于頁面左上角)來放置層。

相對:

使用定位框中輸入的坐標(biāo)(相對于對象在文檔的文本中的位置)來放置層。

該選項不顯示在文檔窗口中。

靜態(tài):

將層放在他在文本中的位置。

顯示:

確定層的初始顯示條件。

假如不指定可見性屬性,則默認(rèn)情況下大多數(shù)瀏覽器都繼承父級的值。

選擇以下可見性選項之一:

繼承:

繼承層父級的可見性屬性。

假如層沒有父級,則他將是可見的。

可見:

顯示該層的內(nèi)容,而不管父級的值是什么。

隱藏:

隱藏這些層的內(nèi)容,而不管父級的值是什么。

Z軸:

確定層的堆疊順序。

編號較高的層顯示在編號較低的層的上面。

值能夠為正,也能夠為負(fù)。

(注:

使用層面板更改層的堆疊順序更容易。

)溢出(僅限于CSS層):

確定在層的內(nèi)容超出他的大小時將發(fā)生的情況。

這些屬性控制怎樣處理此擴展,如下所示:

可見:

增加層的大小,使他的任何內(nèi)容均可見。

層向右下方擴展。

隱藏:

保持層的大小并剪輯任何超出的內(nèi)容。

不提供任何滾動條。

滾動:

在層中添加滾動條,不論內(nèi)容是否超出層的大小。

專門提供滾動條可避免滾動條在動態(tài)環(huán)境中出現(xiàn)和消失所引起的混亂。

該選項不顯示在文檔窗口中,并且僅適用于支持滾動條的瀏覽器。

InternetExplorer和NetscapeNavigator6支持此屬性。

自動:

使?jié)L動條僅在層的內(nèi)容超出他的邊界時才出現(xiàn)。

該選項不顯示在文檔窗口中。

定位:

指定層的位置和大小。

瀏覽器怎樣解釋位置取決于類型配置。

假如層的內(nèi)容超出指定的大小,則大小值被覆蓋。

位置和大小的默認(rèn)單位是像素。

對于CSS層,還能夠指定下列單位:

pc(十二點活字)、pt(點)、in(英寸)、mm(毫米)、cm(厘米)、(ems)、(exs)或%(父級值的百分比)。

縮寫必須緊跟在值之后,中間不留空格:

例如,3mm。

剪輯:

定義層的可見部分。

假如指定了剪輯區(qū)域,能夠通過腳本語言(如javascript)訪問他,并操作屬性以創(chuàng)建像擦除這樣的特別效果。

通過使用改變屬性行為能夠配置這些擦除效果。

配置完這些選項后,在面板左側(cè)選擇另一個CSS類別以配置其他的樣式屬性,或單擊確定。

擴展屬性【定義CSS樣式擴展屬性】擴展樣式屬性包括過濾器、分頁和光標(biāo)選項,他們中的大部分效果僅受InternetExplorer4.0和更高版本的支持。

指定擴展屬性:

在CSS樣式定義對話框中,選擇擴展(如下圖),然后配置所需的樣式屬性。

請注意:

下列任意屬性假如您認(rèn)為不重要能夠保留為空。

分頁:

在打印期間在樣式所控制的對象之前或之后強行分頁。

選擇要在彈出式菜單中配置的選項。

此選項不受任何4.0版本瀏覽器的支持,但可能受未來的瀏覽器的支持。

屬性handcrosshair精確定位+字text文本I形wait等待default默認(rèn)光標(biāo)help幫助e-resize箭頭朝右方ne-resize箭頭朝右上方n-resize箭頭朝上方nw-resize箭頭朝左上方w-resize箭頭朝左方sw-resize箭頭朝左下方s-resize箭頭朝下方se-resize箭頭朝右下方auto自動按照默認(rèn)狀態(tài)改變說明手形光標(biāo):

位于視覺效果下的光標(biāo)選項,是光標(biāo)顯示屬性配置。

當(dāng)指針位于樣式所控制的對象上時改變指針圖像。

選擇彈出式菜單(右圖)進行配置。

(左圖)是他的周詳列表和相關(guān)說明。

過濾器:

又稱CSS濾鏡,對樣式所控制的對象應(yīng)用特別效果。

他把我們帶入絢麗多姿的世界。

正是有了濾鏡屬性,頁面才變得更加漂亮。

從過濾器彈出式菜單中選擇一種效果并視具體需要加以配置。

各種CSS濾鏡屬性的周詳介紹請從導(dǎo)航條選擇濾鏡屬性按鈕瀏覽。

濾鏡概述過濾器:

又稱CSS濾鏡,對樣式所控制的對象應(yīng)用特別效果。

他把我們帶入絢麗多姿的世界。

正是有了濾鏡屬性,頁面才變得更加漂亮。

DWMX2004擴展類過濾器嵌入16項樣式屬性(如下圖),您能夠根據(jù)您的需要從過濾器彈出式菜單中選擇并加以配置。

濾鏡說明AlphaBlendTrans淡入淡出效果Blur風(fēng)吹模糊的效果Chroma指定顏色透明透明的漸進效果DropShadow陰影效果FlipHFlipVGlowGrayInvertLightMaskRevealTrans動態(tài)效果ShadowWaveXray水平翻轉(zhuǎn)垂直翻轉(zhuǎn)邊緣光暈效果彩色圖片變灰度圖底片的效果模擬光源效果矩形遮罩效果輪廓陰影效果波浪扭曲變形效果X光照片效果左表列出16項濾鏡及說明,現(xiàn)在再進一步介紹一下:

Alpha濾鏡:

這個名字,在Flash和Photoshop經(jīng)常見到。

他們的作用基本類似,就是把一個目標(biāo)元素和背景混合。

您能夠指定數(shù)值來控制混合的程度。

這種和背景混合通俗地說就是個元素的透明度。

BlendTrans濾鏡:

他的功能也比較單一,就是產(chǎn)生一種精細(xì)的淡入淡出的效果。

Blur濾鏡:

把他加載到文字上,產(chǎn)生風(fēng)吹模糊的效果,類似立體字,這將為您在網(wǎng)頁上制作立體字標(biāo)題帶來了方便。

也能夠把Blur濾鏡加載到圖片上,能達到用圖象處理軟件制作的效果。

DropShadow顧名思義就是添加對象的陰影效果。

他的實際效果看上去就象是原來的對象離開了頁面,然后在頁面上顯示出該對象的投影。

CSS的無參數(shù)濾鏡共有六個(FlipH、FlipV、Invert、Xray、Gray和Light),雖然他們沒有參數(shù),相對來講,靈活性要差點,但他們用起來更方便,效果也相當(dāng)明顯。

用他們能夠使文字或圖片翻轉(zhuǎn)、獲得圖片的底片效果,甚至能夠制作圖片的X光片效果。

glow濾鏡:

使對象的邊緣就產(chǎn)生類似發(fā)光的效果,glow濾鏡制作這種效果操作很簡便。

Mask濾鏡:

能夠為網(wǎng)頁上的元件對象作出一個矩形遮罩效果。

wave濾鏡:

他的作用是把對象按照垂直的波形樣式扭曲的特別效果。

Light濾鏡:

能產(chǎn)生一個模擬光源的效果,配合使用一些簡單的Javascrpt,使對象產(chǎn)生奇特光照的效果。

RevealTrans動態(tài)濾鏡:

是個神奇的濾鏡,他能產(chǎn)生23種動態(tài)效果,還能在23種動態(tài)效果中隨機抽用其中的一種。

用他來進行網(wǎng)頁之間的動態(tài)轉(zhuǎn)換,很方便。

ALPHA屬性【Alpha濾鏡屬性】這個名字,在Flash和Photoshop經(jīng)常見到。

他們的作用基本類似,就是把一個目標(biāo)元素和背景混合。

您能夠指定數(shù)值來控制混合的程度。

這種和背景混合通俗地說就是個元素的透明度。

通過指定坐標(biāo),能夠指定點、線、面的透明度。

由于Alpha濾鏡的參數(shù)多,我們先來看一下下邊的表格:

參數(shù)名效果說明取值說明OpacityFinishOpacity能夠制作出透明漸變的效果。

取值0~100不透明的程度,百分比。

取值0~100Style指定漸變的顯示形狀。

0:

沒有漸變;1:

線性漸變;2:

圓形漸變;3:

矩形輻射。

StartXStartYFinishXFinishY漸變開始的X坐標(biāo)值漸變開始的Y坐標(biāo)值漸變結(jié)束的X坐標(biāo)值漸變結(jié)束的Y坐標(biāo)值opacity:

代表透明度程度。

范圍是從0~100,他們其實是百分比的形式。

也就是說,0代表完全透明,100代表完全不透明。

finishopacity:

是個可選參數(shù),假如想要配置漸變的透明效果,就能夠使用他們來指定結(jié)束時的透明度。

范圍也是0到100。

style:

指定了透明區(qū)域的形狀特征。

其中0代表統(tǒng)一形狀、1代表線形、2代表放射狀、3代表長方形。

StartX和StartY:

代表漸變透明效果的開始X和Y坐標(biāo)。

FinishX和FinishY:

代表漸變透明效果結(jié)束X和Y坐標(biāo)。

請看下面的演示:

Alpha屬性值:

Alpha(Opacity=50,FinishOpacity=100,Style=0,StartX=0,StartY=0,FinishX=100,FinishY=100)Alpha(Opacity=10,FinishOpacity=100,Style=1,StartX=0,StartY=0,FinishX=100,FinishY=100)Alpha(Opacity=10,FinishOpacity=100,Style=2,StartX=0,StartY=0,FinishX=100,FinishY=100)Alpha(Opacity=10,FinishOpacity=100,Style=3,StartX=0,StartY=0,FinishX=100,FinishY=100)Style加載在單元格td上顯示效果如下圖:

原圖style=0style=1style=2style=3Style加載在圖片上顯示效果如下圖:

原圖style=0style=1style=2style=3Styl

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論