css 活动伪类不执行其工作[已关闭]

jhkqcmku 于 2023-01-06 发布在其他

关注(0)|答案(1)|浏览(168)

**已关闭。**此问题为not reproducible or was caused by typos。当前不接受答案。

这个问题是由打字错误或无法再重现的问题引起的。虽然类似的问题在这里可能是on-topic，但这个问题的解决方式不太可能帮助未来的读者。
2天前关闭。
Improve this question
我正在做一个关于活动的学校作业，我应该满足照片中显示的条件，但是当我点击链接时，什么也没有发生。我做错了什么？
你们能帮我解决这个问题吗？如果有任何错误，或者我可以用我的代码改进的地方，请让我知道。谢谢。

<!DOCTYPE html>
<html>

<head>
  <style>
    .one:link {
      color: white;
      background-color: #264653;
      text-decoration: none;
    }
    
    .two:link {
      color: white;
      background-color: #2a9d8f;
      text-decoration: none;
    }
    
    .sqo {
      border: 1px solid black;
      width: 100px;
      height: 100px;
    }
    
    .sqt {
      border: 1px solid black;
      width: 100px;
      height: 100px;
    }
    
    .one:active {
      color: black;
      background-color: #e76f51;
    }
    
    .one:active~.sqo {
      background-color: #264653;
      color: #E7C26A;
    }
    
    .two:active {
      color: black;
      background-color: #e76f51;
    }
    
    .two:active~.sqt {
      color: #F3A265;
      background: #2a9d8f;
      border: 10px dotted green;
    }
    
    .two:active~.one {
      background-color: #8ab17d;
    }
  </style>
  <title>Events</title>

  <body>
    <a class="one" href=#>First Link</a>
    <a class="two" href=#>Second Link</a>
    <br><br>
    <div class="sqo">Div 1 here</div>
    <br>
    <div class="sqt">Div 2 here</div>
  </body>

</html>

css

来源：https://stackoverflow.com/questions/74992521/active-pseudo-class-doesn-t-do-it-s-job

1条答案

按热度按时间

vsdwdz231#

如果你想要的结果是在你点击它们时改变方块和链接按钮的外观，而不是在你点击它们时，把“活动”改为“焦点”。

.one:focus {
  color: black;
  background-color: #e76f51;
}

.one:focus~.sqo {
  background-color: #264653;
  color: #E7C26A;
}

您可以在W3Schools（https://www.w3schools.com/css/css_pseudo_classes.asp）上找到关于哪个伪类最适合的更多信息

赞(0）回复(0）举报 2023-01-06

我来回答

css 活动伪类不执行其工作[已关闭]

1条答案

相关问题

热门标签

最新问答