你好(这里是长棍面包英语) 所以我得到了一个标志,当你将光标移到它上面时它应该会下降,但它根本不起作用,我不知道为什么我的代码在这里:
.facebook{
left: 0%;
top:-10%;
animation-name: logofb;
animation-duration: 0.5s;
animation-delay: 7.5s;
animation-fill-mode: forwards;
transition-property: top;
transition-duration: 0.5s;
}
@keyframes logofb {
from {top:-10%;}
to {top: 0%;}
}
.facebook:hover {
top: 50px;
}
<span class="facebook reslogo"><img src=facebook.png height="13%" width="13%"></span>
.reslogo {
position: fixed;
z-index: 200;
top: 0px;
}
问题可能是它之前已经有一个动画
最佳答案
你有一个单位的组合,定位发生可以被简化。您可以使用 transform:translateY()
轻松实现此目的:
.facebook {
display:block;
transform:translateY(-10%);
transition:transform .5s ease;
}
.facebook:hover {
transform:translateY(0);
}
<span class="facebook"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c2/F_icon.svg/2000px-F_icon.svg.png" height="13%" width="13%"></span>
关于html - 我的 :hover seem to be in conflict with something,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55288311/