html - CSS3 过渡时间问题

Question

我正在处理一个小的 PHP 脚本，我在使用 transitions css3 proprety 时遇到了问题。当我使用 transition 时，我不知道为什么当用户悬停按钮时它工作正常并且需要 1 秒来更改背景但是当用户将鼠标移出按钮它不需要 1s 它会立即改变。 DEMO

.b{
    width:100%;
}
.b:hover{
    background:#fff;
    transition: 1s;
}
<button class="b">HOVER ME</button>

Answer 1

将转换放在基本状态上，它会双向工作。

编辑:一些浏览器需要基值来转换。另外，我不会在没有定义要转换的内容的情况下设置转换。

此外，我倾向于不转换快捷方式属性。理想情况下，这应该只是过渡背景色。

.b{
    width:100%;
    transition:background-color 1s;
}
.b:hover{
    background-color:#fff;

}

JSfiddle Demo - 修订