亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專(zhuān)欄INFORMATION COLUMN

CSS3 filter（濾鏡）屬性

haoguo / 1037人閱讀

摘要：的濾鏡屬性，可以對(duì)網(wǎng)頁(yè)中的圖片進(jìn)行類(lèi)似圖片處理的效果，例如背景的毛玻璃效果老照片黑白照片火焰效果等。理論上說(shuō)，對(duì)比度是指畫(huà)面黑白明暗的層次飽和度畫(huà)面中色彩的鮮艷程度與層次

css3的濾鏡filter屬性，可以對(duì)網(wǎng)頁(yè)中的圖片進(jìn)行類(lèi)似Photoshop圖片處理的效果，例如背景的毛玻璃效果、老照片（黑白照片）、火焰效果等。

一、blur(px)高斯模糊

二、brightness(%)亮度

三、contrast(%)對(duì)比度

四、drop-shadow()陰影

注意： 這個(gè) drop-shadow 與 box-shadow 都是在說(shuō)陰影，但還是有區(qū)別的，看下圖

圖中火焰的圖片，是一張png圖片，除了火焰以外，其他部分是透明的，我們能看見(jiàn)，box-shadow 是給整個(gè)圖片加陰影，而 drop-shadow 只是給不透明的部分加陰影，這是他們最重要的區(qū)別了。

五、grayscale(%)灰度

六、hue-rotate(deg)色相旋轉(zhuǎn)

七、invert(%)反轉(zhuǎn)

八、opacity(%)透明度

九、saturate(%)飽和度

十、sepia(%)深褐色

上面都只是把每種濾鏡多帶帶拿出來(lái)，展示效果，但是其實(shí)他們是可以一起使用的，比如這樣

.all img{
    filter: brightness(120%) contrast(110%) saturate(120%) hue-rotate(-25deg) drop-shadow(0 0 5px #000);
}

注：飽和度和對(duì)比度是兩個(gè)完全不同的概念，飽和對(duì)是對(duì)色彩的濃度（純度）的定義；對(duì)比度是對(duì)畫(huà)面明暗程度的定義。
理論上說(shuō)，對(duì)比度是指畫(huà)面黑白明暗的層次；飽和度畫(huà)面中色彩的鮮艷程度與層次；

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/114683.html

相關(guān)文章

  • CSS3 filter（濾鏡）屬性

    摘要：的濾鏡屬性，可以對(duì)網(wǎng)頁(yè)中的圖片進(jìn)行類(lèi)似圖片處理的效果，例如背景的毛玻璃效果老照片黑白照片火焰效果等。五灰度六色相旋轉(zhuǎn)七反轉(zhuǎn)八透明度九飽和度十深褐色上面都只是把每種濾鏡單獨(dú)拿出來(lái)，展示效果，但是其實(shí)他們是可以一起使用的，比如這樣 css3的濾鏡filter屬性，可以對(duì)網(wǎng)頁(yè)中的圖片進(jìn)行類(lèi)似Photoshop圖片處理的效果，例如背景的毛玻璃效果、老照片（黑白照片）、火焰效果等。 showIm...

    shevy 評(píng)論0 收藏0

  • 不得不收藏的——IE中CSS-filter濾鏡小知識(shí)大全

    摘要：屬性特性描述可選值，布爾值，默認(rèn)值為，啟用過(guò)濾器為不啟用過(guò)濾器。正常顯示，內(nèi)容對(duì)象將翻過(guò)來(lái)。，設(shè)置對(duì)象是否投影，布爾值，和，設(shè)置對(duì)象投影不透明度，，假如為那么該值無(wú)效。 前言 前段時(shí)間在做一個(gè)專(zhuān)題的時(shí)候用到了opacity不透明度屬性，因?yàn)樵O(shè)計(jì)圖上是半透明背景，白色文字 showImg(https://segmentfault.com/img/bVknaX); 所以在IE用到了其...

    yuanzhanghu 評(píng)論0 收藏0

  • JavaScript寫(xiě)一個(gè)簡(jiǎn)單的Ps濾鏡效果

    摘要：給圖像設(shè)置一個(gè)陰影效果。一值設(shè)定圖像會(huì)被調(diào)整的色環(huán)角度值。的價(jià)值是完全反轉(zhuǎn)。超過(guò)的值是允許的，則有更高的飽和度。值為則完全是深褐色的，值為圖像無(wú)變化。 效果預(yù)覽 showImg(https://segmentfault.com/img/bVbpSTz?w=648&h=729); 思路 其實(shí)非常非常趕單~CSS3多了一個(gè)filter的屬性，非常強(qiáng)大（兼容性一般）！我們只要根據(jù)輸入的值/滑...

    王陸寬 評(píng)論0 收藏0

  • JavaScript寫(xiě)一個(gè)簡(jiǎn)單的Ps濾鏡效果

    摘要：給圖像設(shè)置一個(gè)陰影效果。一值設(shè)定圖像會(huì)被調(diào)整的色環(huán)角度值。的價(jià)值是完全反轉(zhuǎn)。超過(guò)的值是允許的，則有更高的飽和度。值為則完全是深褐色的，值為圖像無(wú)變化。 效果預(yù)覽 showImg(https://segmentfault.com/img/bVbpSTz?w=648&h=729); 思路 其實(shí)非常非常趕單~CSS3多了一個(gè)filter的屬性，非常強(qiáng)大（兼容性一般）！我們只要根據(jù)輸入的值/滑...

    voyagelab 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

haoguo

男|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<