html - Css 过渡不起作用：淡入淡出问题

Question

嗨，我正在使用 Microsoft Expression Web 4 制作一个网站，当我将鼠标悬停在它上面时，我想让一个链接淡入另一个图像，代码是：

.about { background: url('../images/aboutbutton1.png') no-repeat;
min-height: 50px;
max-width: 150px;
-moz-transition: background .45s linear;
-webkit-transition: background .45s linear;
transition: background .45s linear;
}

.about:hover {
background: url('../images/aboutbutton2.png') no-repeat;
min-height: 50px;
max-width: 150px;
-moz-transition: background .45s linear;
-webkit-transition: background .45s linear;
transition: background .45s linear;
}

但每次我这样做它都不会褪色它只是切换！请帮忙！