css3 - transition属性当鼠标一开的时候设置的时间不起作用

Question

#last-goods{
    background: url("../images/lasted-goods.jpg") no-repeat;
    width:100%;
    height:73px;
    overflow: hidden;
}
#last-goods:hover{
    -webkit-box-shadow:10px 10px 20px #b7b7b7;
    -box-shadow:10px 10px 20px #b7b7b7;
    transition: 1s all linear;
    -webkit-transition: 1s all linear;
    -webkit-transform: translate3d(0, -2px, 0);
    -moz-transform: translate3d(0, -2px, 0);
    -ms-transform: translate3d(0, -2px, 0);
    -o-transform: translate3d(0, -2px, 0);
    transform: translate3d(0, -2px, 0);
}

css属性如上，鼠标离开时，阴影瞬间消失怎么办

Answer 1

transition写在上面，不要写在伪类后面

Answer 2

1.transition写在元素上而不是伪类上
2.元素上要有一个transform的初始值

Answer 3

这些属性本来不用伪类可以自行执行，transition 你得放在要过渡的元素上面