检查Firebug或Chrome DevTools中的悬停状态

Question

我有一个具有CSS悬停状态的HTML元素.悬停时有边距或填充的错误,每次鼠标悬停时,元素的内容都会滑动一点,这很烦人.

我想使用FireBug或Chrome Dev Tools进行调试,但我使用这些工具时遇到的一个常见问题是,从Firebug/devtools中选择元素后,我显然需要将鼠标移回开发工具和悬停状态不再启用.

如何在悬停状态下使用这些工具检查/调试HTML元素？

Answer 1

Chrome开发者工具在"元素">"样式"面板中有一个内置:悬停状态选择器.您也可以切换其他伪类(如:active).

Answer 2

用于测试:Chrome中的悬停状态

用于测试:Firefox中的悬停状态(你需要使用firebug)

Answer 3

这是一个针对firebug的屏幕截图以及那些不够敏锐的人看到agriboz的评论(像我一样)