我的网站上有一个很好的小悬停效果,当用户将鼠标悬停在某个链接上时会快速转换.但是当用户将鼠标悬停在盒子上时,阴影(和其他特征)会立即消失,而不是逐渐消失.有没有办法我可以让属性淡入和淡出,也许使用某种: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; }
当我刚刚离开转换时,我经历了这个确切的事情:)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。