img { filter: grayscale(100%); /* 置图像为灰度图像 */ } img { filter: invert(100%); /* 反转图像颜色 */ }
首先,大家可以使用CSS的滤镜属性filter
来置图像为灰度图像,方法是通过grayscale
函数,确定图像呈现灰度效果的程度,100%表示完全灰度。
大家同样可以使用filter
属性来反转图像颜色,即通过invert
函数实现,同样也可以通过参数来控制颜色的反转程度,100%表示完全反转。
如果大家希望仅仅修改图像的某个部分而不影响整个图像,则可以使用background-color
来更改背景色。例如,如果您愿意将火车头从蓝色转换为红色,只需将其包含在容器中,然后添加以下CSS样式:
.container { background-color: red; } img { background-color: blue; }
通过将容器的背景颜色设置为红色,大家将火车头的背景颜色更改为红色。但是同样需要将图像的背景颜色设置为原来的蓝色,否则整张图片的背景颜色将全部变为红色。