CSS3 中的滤镜(filter)功能让我们轻松方便简单的处理图片,而不需要使用 PhotoShop 或者使用很多 JavaScript、PHP 代码。这个属性已经得到比较新的 Firefox、Safari、Chrome 浏览器支持,而且我们可以通过综合的可替代的技术来模拟实现这个效果——甚至是 IE 浏览器。
本文中,我们将使用标准测试图片 Lena Söderberg (译者注:Lena 这张美女照片,被作为图片压缩的标准测试用图片)作为演示,使用 CSS 将其转换成黑白图片。在下面我将讲解如何使用 CSS 的这个功能实现调整色调、模糊、亮度、对比度和一些其他的效果。效果图:
CSS3 的灰阶滤镜
使用 CSS3 来稀释一个图片的颜色,再简单不过了。我们可以把这个 CSS 语句写成一个类,这样遇到想要效果的图片,直接加上个类就可以了。
新闻热点
疑难解答