You can read how to use hover together with media queries from this MDN docs (CCS4 convention) .
下面是一个如何在媒体查询中使用鼠标悬停的例子.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>News</title>
<style>
@media screen and (min-width: 992px) and (hover: hover) {
#menu a:hover {
border-bottom: 1px solid #3a3a3a;
}
}
</style>
</head>
<body>
<div id="menu">
<a href="#">Try hovering over me! I get underline on Hover</a>
</div>
<div>
<a href="#">Hovering over me doesn't apply style</a>
</div>
</body>
</html>
至于您的 case (基于您在 comments 中链接的代码):
case where you want "actively visited". You have to use either :active selector or :visited selector based on your need.
Currently your code has a class="visited" applied to all your links, which gives you the content of .visited permanently. If you use selector you will get desired output.
I think you want to toggle between the links and show page below based on what is selected. I would recommend you use any scripting language to achieve that. Since it would be much easier. Refer to some navbar code's since you are new.
由于.visited与HOVER具有相同的代码，因此您无法在HOVER上看到任何更改.如果您注释.visited或将其更改为适当的 Select 器.它会对你起作用的.