关于纯用css写导航鼠标移入事件的问题?
高洛峰
高洛峰 2016-10-26 14:48:49
0
1
924

如何纯用css去实现下面这个效果:

一级导航的第一个导航的二级导航默认是显示的(其他导航项目的二级导航是隐藏的display:none;),
当鼠标移到一级导航的其他导航项目时,默认显示的第一个二级导航隐藏,
与此同时,鼠标移入的导航项的二级导航显示,这时再移开鼠标时,回到默认状态(即显示第一个导航的二级导航)

和QQ音乐导航的效果差不多求解ㅜ.ㅜ


高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

Antworte allen (1)
三叔

大概是这样

HTML:


          
    • ...
    • ...
    • ...

CSS:

.nav li:first-child .subnav{ display: block; } .nav:hover li:first-child .subnav{ display: none; } .nav:hover li:hover .subnav{ display: block; }


    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!