我的网站上有一个很好的小悬停效果,当用户将鼠标悬停在某个链接上时会快速转换.但是当用户将鼠标悬停在盒子上时,阴影(和其他特征)会立即消失,而不是逐渐消失.有没有办法我可以让属性淡入和淡出,也许使用某种：un-hover类型的伪类？谢谢！如果它有帮助,这里是CSS块：
a.squares:hover,a.squares:active {
color: black;
background-color: #E8E8E8;
Box-shadow: 0 0 12px black;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-webkit-transition: color 0.1s ease-in-out,background-color 0.1s ease-in-out,Box-shadow 0.1s ease-in-out;
-moz-transition: color 0.1s ease-in-out,Box-shadow 0.1s ease-in-out;
transition: color 0.1s ease-in-out,Box-shadow 0.1s ease-in-out;
}
解决方法
将转换放在a.squares而不是a.squares：hover
a.squares {
-webkit-transition: color 0.1s ease-in-out,Box-shadow 0.1s ease-in-out;
}
a.squares:hover,a.squares:active {
color: black;
background-color: #E8E8E8;
Box-shadow: 0 0 12px black;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}
当我刚刚离开转换时,我经历了这个确切的事情:)
