css - 在常见问题解答中，如何在用户仅使用 CSS 单击后设置事件 q 的样式？

Question

<ul>
 <li>
  <a href='#q1' class='contentlink'>
  Question One?
  </a>
 </li>
 <li>
  <a href='#q2' class='contentlink'>
  Question Two?
  </a>
 </li>
</ul>


   <h3 id='q1'>
    This is Question One?
    </h3>

    <p>
    This is the answer to question one.
    </p>

    <h3 id='q2'>
    This is Question Two?
    </h3>

    <p>
    This is the answer to question two.
    </p>

在不使用 jQuery 的情况下，有没有一种方法可以让我使用某种 :active CSS 来设置问题的样式，比如让选择问题的颜色不同？我尝试这样做:

<h3 id='q3' class='faq'>This is the question?</h3>

然后在我的样式表中:

h3.faq:active {
color: yellow;
}

但它并没有改变问题的颜色。

Answer 1

您正在寻找 :target pseudoclass .像这样使用它:

h3:target {
    color: yellow;
}