css 鼠标经过图片缓慢切换图片、鼠标离开缓慢还原

.header .logo {
    width: 54px;
    height: 54px;
    margin:23px 0;
    text-align: center;
    border-radius: 54px;
    background: url("/static/images/icon/logo.png");
    border: #e38d13 solid;

    transition: all 0.6s;

}

    /* logo 水平反转 */
.header .logo:hover {
    background-position: -54px 0;

}