CSS3背景图像转换

CSS3背景图像转换,css,css-transitions,Css,Css Transitions,在这个网站上,我制作了一个箭头链接,当你将鼠标悬停在它上面时,它会变成一个新的图像,图像中添加了一个很酷的元素。我在下面的代码中工作得非常好,我根本没有编辑代码,但当我醒来时,“所有”转换似乎不再适用于此。我找不出有什么问题。我也用它来淡入一个纯色的背景图像,淡入另一个不同纯色的背景图像 a.visitarrow { -webkit-transition:all 1.0s ease-in-out; -moz-transition:all 1.0s ease-in-out; -o-transiti

在这个网站上,我制作了一个箭头链接,当你将鼠标悬停在它上面时,它会变成一个新的图像,图像中添加了一个很酷的元素。我在下面的代码中工作得非常好,我根本没有编辑代码,但当我醒来时,“所有”转换似乎不再适用于此。我找不出有什么问题。我也用它来淡入一个纯色的背景图像,淡入另一个不同纯色的背景图像

a.visitarrow
{
-webkit-transition:all 1.0s ease-in-out;
-moz-transition:all 1.0s ease-in-out;
-o-transition:all 1.0s ease-in-out;
-ms-transition:all 1.0s ease-in-out;        
transition:all 1.0s ease-in-out;
display:block;
width:130;
height:121;
background-image:url('pictures/visit.png');
}

a.visitarrow:hover
{
-webkit-transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
-ms-transition:all 0.5s ease-in-out;        
transition:all 0.5s ease-in-out;
display:block;
width:130;
height:121;
background-image:url('pictures/visithover.png');
}

我认为这应该是可行的:

a.visitarrow {
    display: block;
    width: 130;
    height: 121;
    -webkit-transition: 1.0s ease-in-out;
    -moz-transition: 1.0s ease-in-out;
    -o-transition: 1.0s ease-in-out;
    -ms-transition: 1.0s ease-in-out;        
    transition: 1.0s ease-in-out;
    background-image: url('pictures/visit.png');
}

a.visitarrow:hover {
    background-image: url('pictures/visithover.png');
}

我认为这应该是可行的:

a.visitarrow {
    display: block;
    width: 130;
    height: 121;
    -webkit-transition: 1.0s ease-in-out;
    -moz-transition: 1.0s ease-in-out;
    -o-transition: 1.0s ease-in-out;
    -ms-transition: 1.0s ease-in-out;        
    transition: 1.0s ease-in-out;
    background-image: url('pictures/visit.png');
}

a.visitarrow:hover {
    background-image: url('pictures/visithover.png');
}

我以为你不能转换背景图像。你确定它有效吗?我100%确定它有效了大约一周,可能是浏览器更新?Firefox昨天更新了。chrome:/我猜不可能保留。我想你不能转换背景img。你确定它有效吗?我100%确定它有效了大约一周,可能是浏览器更新?Firefox昨天更新了。chrome:/我猜它不可能保存。