html - 使用 CSS 更改所选元素的颜色

Question

我有一个元素列表。用户可以通过单击来选择一个元素。我想使用 CSS 更改所选元素的颜色。假设用户点击了 item1，那么 item1 会变成红色。现在如果用户点击元素 2，那么元素 2 会变成红色。我的 HTML 代码:

<ul>
  <li>item1</li>
  <li>item2</li>
  <li>item3</li>
</ul>

Answer 1

向每个 li 元素添加一个 tabindex 允许您应用一个 :focus 伪类:

li:focus {
  color: red;
  outline: none;
}

<ul>
  <li tabindex=1>item1</li>
  <li tabindex=1>item2</li>
  <li tabindex=1>item3</li>
</ul