CSS li：悬停工作，但我想让它也可点击

Question

查看www.sadrobotdevelopment.com，了解我所谈论的内容（最佳浏览方式）

#menu li:hover > ul {
    opacity: 1;
    visibility: visible;
    margin: 0;
}

这是使菜单弹出的CSS，我想弄清楚如何使它也可以点击。主要是因为平板电脑和智能手机没有悬停。 CSS中是否有可以处理此问题的内容，或者我是否需要考虑让我的网站针对移动浏览进行优化？

Answer 1

如果在子UL之前有链接，您可以使用:focus和:active伪类作为与邻近兄弟组合子一起使用的链接：

#menu LI > A:focus  + UL,
#menu LI > A:active + UL {
    opacity: 1;
    /*...*/
}

Answer 2

无法使用纯CSS实现点击事件。您可以连接一个javascript单击处理程序，为您的元素添加一个“活动”类，并让CSS另外使用它。