css3 filter

CSS3 filter是一组属性，用于为图像添加各种视觉效果和滤镜效果。它可以实现模糊、亮度调节、对比度调节、阴影设置、灰度、色相旋转、反转图像输入、透明度、饱和度和褐色转化等效果。
其中，filter:blur(px)可以使用高斯模糊效果，filter:brightness(%)可以调节亮度，filter:contrast(%)可以调节对比度，filter:drop-shadow(offset-x offset-y blur spread color)可以设置阴影，filter:grayscale(%)可以实现灰度效果，filter:hue-rotate(deg)可以应用色相旋转，filter:invert(%)可以反转图像输入，filter:opacity(%)可以调节透明度，filter:saturate(%)可以调节饱和度，filter:sepia(%)可以进行褐色转化。
例如，filter:hue-rotate(55deg)可以根据色相环的度数对应相应的颜色。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [css3 filter滤镜属性制作图片滤镜特效 ](https://download.csdn.net/download/siwim/11984144)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *2* [CSS3 filter滤镜详解](https://blog.csdn.net/pycharm_k/article/details/105583337)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *3* [CSS3的filter属性](https://blog.csdn.net/qq_44849271/article/details/120113819)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]