过渡补充

为什么设置的过渡top：100px瞬间就变化，然而delay和duration都不起作用呢，要在前面的设置基准值
代码示例

.item{
    width: 230px;
    height: 300px;
    text-align: center;
    background-color: #ffffff;
    float: left;
    margin-right: 20px;
    overflow: hidden;      /* 溢出hidden*/
    box-shadow: #41a8ff 0px 5px 5px ;
    position: relative;
    top: 0; /*要设置基准*/
}

<div class="item">
            <div class="pic">
                <img src="images/5.png" alt="">
            </div>
            <div class="desc">
                <div class="detail">
                    <i>￥36</i>[已售7件]
                    <a href="images/qq.gif" alt="联系卖家" title="联系卖家"></a>
                </div>
            </div>
        </div>

.item:hover{
    position: relative;
    top: -5px;/*要在前面加top的基准*/
    /*transition: all 2s;*//*老师讲的。所有效果全都2s*/
    transition-delay: 0.12s;
    transition-duration: 400ms;
    box-shadow: 0 0 15px #aaaaaa;
}
.item:hover .desc{
    bottom: 0;
    transition-delay: 0.12s;
    transition-duration: 400ms;
}