css - 背景图像之间的动画变化？

Question

我在我的网站上使用绿色图像作为重复背景图块。当您单击一个元素时，背景会变为蓝色的重复图像。

我想为颜色变化设置动画。这可以用 CSS3 完成吗？一种解决方案是使用黑白图像作为可耕种图案并使用 CSS3 对其进行着色吗？

Answer 1

background-image与其使用纯色的瓷砖，不如给它一个透明的背景。这将允许您转换background-color使用 CSS3 以达到相同的效果：

演示：http: //jsfiddle.net/yLLNa/

CSS

html {
    background-color: red;
    transition: background-color 1s linear;
}

html:hover {
    background-color: blue;
}