CSS濾鏡Chroma在滾動條上的應用

從前做電子書的時候曾經用到過這個屬性，當時并沒有在意。不過現在覺得，這個屬性應用在超市索引頁中甚合我意，原因是個人越來越鐘愛線條簡潔、簡單的風格。一般的滾動條部分代碼形如：

filter: chroma(color=#D4D4D4);
scrollbar-3dlight-color: #D4D4D4; /*立体滚动条亮边的颜色*/图1
scrollbar-highlight-color: #D4D4D4; /*滚动条空白部分的颜色*/图2
scrollbar-shadow-color: #D4D4D4; /*立体滚动条阴影的颜色*/图3
scrollbar-darkshadow-color: #D4D4D4; /*立体滚动条强阴影的颜色*/图4
scrollbar-face-color: #D4D4D4; /*立体滚动条的颜色*/图5
scrollbar-arrow-color: #FFFFFF; /*三角箭头的颜色*/图6
scrollbar-track-color: #D4D4D4; /*立体滚动条背景颜色*/图7
scrollbar-base-color: #D4D4D4; /*滚动条的基本颜色*/

语法：

filter: chroma(color=#D4D4D4)

其中“#D4D4D4”是颜色值。

作用效果：如果滤镜中的像素有颜色与设定的颜色相同，则该像素变为透明。上面顯示的結果就是只有兩個箭頭，這是為了更好地融入到背景中，把滾動條的其他顏色“過濾”掉了。由于默認滾動條有許多顏色，所以我把所有顏色統一后，只留下一個顯示上拉和下拉箭頭scrollbar-arrow-color的顏色，然后應用chroma濾鏡就實現了這種效果。不過這是IE專有屬性，用Firefox或Opera就看不到效果了……