html - 悬停事件不会在 devtools 中显示更改的样式，直到我强制 devtools 的悬停状态

Question

我有这个简单的代码

<style>input:hover{border: 3px solid blue;}</style>
<input type="text">

预期行为:当我将鼠标悬停在输入上时，新样式应该出现在 devtools 样式部分，但它仅在我通过 devtools(而不是鼠标)强制悬停状态时出现。我记得它应该在两种情况下都显示样式，我错了吗？这在 chrome 和 firefox devtools 中都会发生，所以我无法真正理解发生了什么，我使用 css 3 年，我不记得这个问题。

Answer 1

我相信大多数开发工具过去都用于显示悬停状态，但现在我认为没有任何工具可以显示悬停状态(无需点击)。可能是因为他们添加了对如此多的元素状态的支持，如果他们将它们全部显示出来，可能会变得困惑。