在常见问题解答中，如何在用户仅使用CSS点击活动q后设置活动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;
}

Answer 2

您正在寻找的是目标伪类。它的目标是在URL中的“＃”之后出现id的元素。

看看这个小提琴：http://jsfiddle.net/9MXq3/

示例CSS：

h3:target{
background: #ddd;
}