CSS3转换轻松进出盒子阴影

前端之家收集整理的这篇文章主要介绍了CSS3转换轻松进出盒子阴影前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试使用 CSS3获取div id,以减轻盒子阴影.

我现在的CSS是:

#how-to-content-wrap-first:hover {
-moz-Box-shadow: 0px 0px 5px #1e1e1e; 
-webkit-Box-shadow: 0px 0px 5px #1e1e1e; 
Box-shadow: 0px 0px 5px #1e1e1e;
-webkit-transition: Box-shadow 0.3s ease-in-out 0s;
-moz-transition: Box-shadow 0.3s ease-in-out 0s;
-o-transition: Box-shadow 0.3s ease-in-out 0s;
-ms-transition: Box-shadow 0.3s ease-in-out 0s;
transition: Box-shadow 0.3s ease-in-out 0s;

我遇到的问题是,在元素的第一个悬停上,没有放宽或缩小,然后任何后续的徘徊放松,但不要放松.

任何建议人们都会非常感激

解决方法

您需要使用.class上的转换,而不是.class:hover

Demo

div {
    height: 200px;
    width: 200px;
    Box-shadow: none;
    transition: Box-shadow 1s;
    border: 1px solid #eee;
}

div:hover {
    Box-shadow: 0 0 3px #515151;
}

猜你在找的CSS相关文章