css3动画怎么触发子菜单隐藏和显示
发布网友
发布时间:2022-04-25 18:34
我来回答
共1个回答
热心网友
时间:2022-05-14 03:14
itjob为您解答:
<style>
.it{
list-style:none;
}
.it li{
float:none;
width:50px;
height:30px;
position:relative;
margin-right:10px;
}
.it li ul{
display:none;
position:absolute;
top:30px;
left:0px;
}
.it li a{
display:block;
text-decoration:none;
}
@keyframes itjob{
display:block;
}
.it li a:hover ul{
animation:itjob 2s;
}
</style>
html:
<div class="div1">
<ul class="it">
<li><a href="#">远标培训1</a></li>
<li>
<a>
<ul>
<li><a href="#">远标培训2</a></li>
</ul>
</a>
</li>
<li><a href="#">远标培训3</a></li>
</ul>
</div>