因为css之后和之前都不起作用？答案

【问题标题】：because after and before css are not working?因为css之后和之前都不起作用？
【发布时间】：2022-11-01 21:54:55
【问题描述】：

但是，单击时没有任何反应。会是什么？

预期的是，每当单击每个 li 时，它下面都会有一个栏。

li::after {
  border-radius: 2px;
  border-bottom: red solid 3px;
  transition: all .3s ease-in-out;
}

li::before {
  content: "";
}

<nav>
  <ul class="nav_link">
    <strong>
      <li onclick="tabs('avisos')">Avisos</li>
      <li onclick="tabs('atividades')">Atividades</li>
      <li onclick="tabs('trabalhos')">Trabalhos</li>
      <li onclick="tabs('provas')">Provas</li>
      <li onclick="tabs('aulas')">Aulas</li>
    </strong>
  </ul>
</nav>

【问题讨论】：

您的第一条规则中没有 content 属性。
当单击li 元素之一时，您显示的代码中的任何内容都不会执行任何操作。我猜您忘记包含具有该功能的tabs() 的JS...？
此外，strong 元素不是列表元素的有效子元素。您似乎将它用于样式，这无论如何都是不合适的。

标签： javascript html css

【解决方案1】：

您可能正在寻找 li:active 或 li:visited 请注意，当使用li:active 时，该项目只会在鼠标按钮按下时被加下划线。

More here

【讨论】：

这就是重点，点击时要加下划线。