css filter 使用css实现图片模糊效果（毛玻璃）

在之前的项目开发中，我遇到了一个需求：需要对图片进行模糊处理。通过搜索，我发现了filter-blur，这个CSS属性非常强大，可以处理许多图片特效，不仅仅是模糊效果。filter属性让浏览器具备了类似图片处理器的功能。我们可以从Mozilla的文档中了解到，使用filter: grayscale(1)可以轻松实现灰度滤镜效果。左图为原图，右图则应用了灰度滤镜属性。你可以想象，在某些特殊的日子里，需要全站变灰以示哀悼时，这个属性非常实用。

不过，兼容性问题仍需考虑。对于不同的浏览器，CSS属性的兼容性可能有所差异。为了确保你的网页在各类浏览器中都能正常显示，建议参考以下资源：CSS兼容性详解、CSS浏览器兼容性学习 和 CSS属性兼容性对照表。这些文档可以帮助你在开发中更好地处理兼容性问题，确保网页在不同设备和浏览器中都有出色的表现。