Html 悬停效果div位置和边框

当我在一个div上悬停时，我想改变它上的一些东西

我想使长方体阴影变大，并将div稍微向上和向左移动，同时不影响围绕该div的其他div。这是我到目前为止的代码

#divshadow {
    box-shadow: 2px 2px 10px #888;
    -moz-box-shadow: 2px 2px 10px #888;
    -webkit-box-shadow: 2px 2px 10px #888;
    border-radius: 7px;
    margin-right:  3%;
    padding-top: 8px
}

.divshadow:hover {
}

---

下面是一个使用CSS3转换的解决方案。

#divshadow:hover

上的值需要根据您的需要进行调整

---

太棒了！非常感谢你。唯一的问题是，在ie中，它会移动两次，因此看起来会起伏不定。这不是一个平滑的移动，而是两个移动。我通过在一个好的浏览器中将.5s替换为0修复了这一点，过渡应该是非常平滑的。将时间设置为您希望转换所需的时间，该时间应立即发生，0有效地消除了转换的需要：）

<div id="divshadow" class="divshadow"
    style="float:left;width:30%; margin-left:2%"></div>

#divshadow {
    box-shadow: 2px 2px 10px #888;
    -moz-box-shadow: 2px 2px 10px #888;
    -webkit-box-shadow: 2px 2px 10px #888;
    border-radius: 7px;
    margin-right:3%;
    padding-top:8px;

    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    position:relative;
    top:0px;
    left:0px;
}
#divshadow:hover {
    top:-3px;
    left:-3px;
    box-shadow: 2px 2px 20px #888;
    -moz-box-shadow: 2px 2px 20px #888;
    -webkit-box-shadow: 2px 2px 20px #888;
}