5 个回答

div.title>div.list
.list{
display:none;
}
.title:hover .list{
display:block;
}
原理大概就是使用css伪类来达到hover状态响应,从而改变下拉内容的显示。

下拉菜单,如果是css的话,可以直接用父class:hover 子class然后设置opacity:1甚至可以加上过渡效果。

利用css的伪类来实现class:hover,如果要使用过渡,那就有好几种办法了

使用浏览器开发工具就可以查看其代码结构,爱奇艺是点击事件监听,把下拉菜单由display:none;改成display:block;用CSS的话,就只能使用伪类实现吧,楼上的回复那样。

完全使用CSS只能做出一模一样的样式,但是所有的点击事件必须用js来完成。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进