用于扩展选择（下拉）元素的 CSS 选择器

Question

当下拉菜单打开或关闭时，如何设置不同的样式？是否有任何伪选择器或技巧？当然没有javascript。

<select>
  <option> op1 </option>
  <option> op2 </option>
</select>

并且 :hover 并不真正适合我的需要，因为当下拉菜单展开时，我可以将光标移开。它仍然是开放的，但 :hover 样式不再适用。

Answer 1

你在找吗:hover？

如果鼠标悬停在元素上方，则它是元素的状态。

a {
  color: blue;
}
a:hover {
  color: red;
  text-decoration: overline;
}

<a href="#">Move the mouse over me</a>