日本好好热aⅴ|国产99视频精品免费观看|日本成人aV在线|久热香蕉国产在线

  • <cite id="ikgdy"><table id="ikgdy"></table></cite>
    1. 西西軟件園多重安全檢測(cè)下載網(wǎng)站、值得信賴的軟件下載站!
      軟件
      軟件
      文章
      搜索

      首頁(yè)西西教程DreamWeaver → CSS filter濾鏡屬性及用法

      CSS filter濾鏡屬性及用法

      相關(guān)軟件相關(guān)文章發(fā)表評(píng)論 來(lái)源:本站整理時(shí)間:2010/11/9 10:14:14字體大。A-A+

      作者:佚名點(diǎn)擊:1077次評(píng)論:0次標(biāo)簽: CSS 濾鏡

      • 類型:電子資料大小:3.9M語(yǔ)言:中文 評(píng)分:10.0
      • 標(biāo)簽:
      立即下載
      filter:filtername(parameters)即 filter:濾鏡名(參數(shù))

      其中,filter是濾鏡選擇符;filtername是濾鏡的屬性名,這里包括alpha、blur、chroma等

      多種屬性;parameters是屬性參數(shù)值。屬性名及參數(shù)值請(qǐng)看下面的《filter屬性及屬性值》。

      具體的應(yīng)用有兩種方法:

      1、先定義好CSS ,再在頁(yè)面中需要的對(duì)象上使用預(yù)先定義好的CSS,實(shí)際上CSS的設(shè)置對(duì)話框里已經(jīng)預(yù)先將這些濾鏡的語(yǔ)法設(shè)置好了,我們只需填上適合的具體參數(shù)即可。

      2、直接在支持CSS濾鏡效果的HTML控件元素上編寫CSS filter代碼。

      可視化濾鏡屬性應(yīng)用的HTML合法的控件和它們的說(shuō)明

      元 素 說(shuō) 明
      BODY 網(wǎng)頁(yè)文檔的主體元素,所有的可見(jiàn)范圍都在元素內(nèi)
      BUTTON 表單域的按鈕,可以有“發(fā)送(submit)”、“重置(reset)”等形式
      DIV 定義了網(wǎng)頁(yè)上的一個(gè)區(qū)域,這個(gè)區(qū)域的高度、寬度或者絕對(duì)位置都是以知的
      IMG 圖片元素,通過(guò)指定“src"屬性來(lái)指定圖片的來(lái)源
      INPUT 輸入表單域
      MARQUEE 移動(dòng)字幕效果
      SPAN 定義了網(wǎng)頁(yè)上的一個(gè)區(qū)域,這個(gè)區(qū)域的高度、寬度或者絕對(duì)位置都是以知的
      TABLE 表格
      TD 表格數(shù)據(jù)單元格
      TEXTAREA 文本區(qū)域
      TFOOT 多行輸入文本框
      TH 表格標(biāo)題單元格
      THEAD 表格標(biāo)題
      TR 表格行




      編寫CSS filter代碼基本語(yǔ)法:


      filter屬性及屬性值



      濾鏡名 說(shuō) 明 濾鏡名 說(shuō) 明
      Alpha 設(shè)置透明度 Blur 設(shè)置模糊效果
      Chroma 設(shè)置指定顏色透明 Dropshadow 設(shè)置投射陰影
      Fliph 水平翻轉(zhuǎn) Flipv 垂直翻轉(zhuǎn)
      Glow 對(duì)象的外邊界增加光效 Grayscale 設(shè)置灰度(降低圖片的色彩度)
      Invert 設(shè)置底片效果 Light 設(shè)置燈光投影
      Mask 設(shè)置透明膜 Shadow 設(shè)置陰影效果
      Wave 利用正弦波紋打亂圖片 Xray 只顯示輪廓

      1、Alpha:設(shè)置透明層次

        語(yǔ)法:STYLE="filter:Alpha(Opacity=opacity, FinishOpacity=finishopacity,Style=style, StartX=startX,StartY=startY,F(xiàn)inishX=finishX,F(xiàn)inishY=finishY)"
        說(shuō)明:
        Opacity:起始值,取值為0~100, 0為透明,100為原圖。
        FinishOpacity:目標(biāo)值。
        Style:1或2或3
        StartX:任意值
        StartY:任意值
        例子:filter:Alpha(Opacity="0",FinishOpacity="75",Style="2")


      2、blur:創(chuàng)建高速度移動(dòng)效果,即模糊效果
        語(yǔ)法:STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
        說(shuō)明:
        Add:一般為1,或0。
        Direction:角度,0~315度,步長(zhǎng)為45度。
        Strength:效果增長(zhǎng)的數(shù)值,一般5即可。
        例子:filter:Blur(Add="1",Direction="45",Strength="5")


      3、Chroma:制作專用顏色透明
        語(yǔ)法:STYLE="filter:Chroma(Color = color)"
        說(shuō)明:color:#rrggbb格式,任意。
        例子:filter:Chroma(Color="#FFFFFF


      4、DropShadow:創(chuàng)建對(duì)象的固定影子
        語(yǔ)法:STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
        說(shuō)明:Color:#rrggbb格式,任意。
        Offx:X軸偏離值。
        Offy:Y軸偏離值。
        Positive:1或0。
        例子:filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")


      5、FlipH:創(chuàng)建水平鏡像圖片
       語(yǔ)法:STYLE="filter:FlipH"
        例子:filter:FlipH


      6、FlipV:創(chuàng)建垂直鏡像圖片

        語(yǔ)法:STYLE="filter:FlipV"
        例子:filter:FlipV


      7、glow:加光輝在附近對(duì)象的邊外

        語(yǔ)法:STYLE="filter:Glow(Color=color, Strength=strength)"
        說(shuō)明:
        Color:發(fā)光顏色。
        Strength:強(qiáng)度(0-100)
        例子:filter:Glow(Color="#6699CC",Strength="5")


      8、gray:把圖片灰度化
        語(yǔ)法:STYLE="filter:Gray"
        例子:filter:Gray


      9、invert:反色
        語(yǔ)法:STYLE="filter:Invert"
        例子:filter:Invert


      10、Light:設(shè)置燈光投影

      語(yǔ)法:Filter{light}

      這個(gè)屬性模擬光源的投射效果。一旦為對(duì)象定義了“LIGHT"濾鏡屬性,那么就可以調(diào)用它的“方法(Method)
      "來(lái)設(shè)置或者改變屬性!癓IGHT"可用的方法有:
      AddAmbient 加入包圍的光源
      AddCone 加入錐形光源
      AddPoint 加入點(diǎn)光源
      Changcolor 改變光的顏色
      Changstrength 改變光源的強(qiáng)度
      Clear 清除所有的光源
      MoveLight 移動(dòng)光源
      可以定義光源的虛擬位置,以及通過(guò)調(diào)整X軸和Y軸的數(shù)值來(lái)控制光源焦點(diǎn)的位置,還可以調(diào)整光源的形式
      (點(diǎn)光源或者錐形光源)指定光源是否模糊邊界、光源的顏色、亮度等屬性。如果動(dòng)態(tài)的設(shè)置光源,可能回
      產(chǎn)生一些意想不到的效果。后面幾頁(yè)會(huì)有具體范例。


      11、mask:創(chuàng)建透明掩膜在對(duì)象上
        語(yǔ)法:STYLE="filter:Mask(Color=color)"
        例子:filter:Mask (Color="#FFFFE0")


      12、shadow:創(chuàng)建偏移固定影子
        語(yǔ)法:filter:Shadow(Color=color, Direction=direction)
        說(shuō)明:
        Color:#rrggbb格式。
        Direction:角度,0-315度,步長(zhǎng)為45度。
        例子:filter:Shadow (Color="#6699CC", Direction="135")


      13、wave:波紋效果
        語(yǔ)法:filter: Wave(Add=add,F(xiàn)req=freq,LightStrength=strength,Phase=phase,Strength=strength)
        說(shuō)明:
        Add:一般為1,或0。
        Freq:變形值。
        LightStrength:變形百分比。
        Phase:角度變形百分比。
        Strength:變形強(qiáng)度。
        例子:filter: wave(Add="0", Phase="4", Freq="5", LightStrength="5", Strength="2")


      14、Xray:使對(duì)象變得像被x光照射一樣

        語(yǔ)法:STYLE="filter:Xray"
        例子:filter:Xray

      15.顏色變化
      語(yǔ)法:filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#B5CCFA', EndColorStr='#B5CCFA');

        相關(guān)評(píng)論

        閱讀本文后您有什么感想? 已有人給出評(píng)價(jià)!

        • 8 喜歡喜歡
        • 3 頂
        • 1 難過(guò)難過(guò)
        • 5 囧
        • 3 圍觀圍觀
        • 2 無(wú)聊無(wú)聊

        熱門評(píng)論

        最新評(píng)論

        發(fā)表評(píng)論 查看所有評(píng)論(0)

        昵稱:
        表情: 高興 可 汗 我不要 害羞 好 下下下 送花 屎 親親
        字?jǐn)?shù): 0/500 (您的評(píng)論需要經(jīng)過(guò)審核才能顯示)