如何 - 添加图像效果
了解如何为图像添加视觉效果。
图像滤镜
CSS 滤镜
CSS filter
属性为元素添加视觉效果(如模糊和饱和度)。
注意: 滤镜属性在 Internet Explorer、Edge 12 或 Safari 5.1 及更早版本中不受支持。
灰度示例
将所有图像的颜色更改为黑白色(100% 灰色)
img {
-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
filter: grayscale(100%);
}
原始图像
grayscale(100%)
模糊示例
对所有图像应用模糊效果
img {
-webkit-filter: blur(5px); /* Safari 6.0 - 9.0 */
filter: blur(5px);
}
原始图像
blur(5px)
访问我们的 CSS 滤镜属性 了解有关 CSS 滤镜的更多信息。