我想看到:hover样式的锚,我在Chrome中徘徊。在Firebug中,有一个样式下拉菜单,允许我为一个元素选择不同的状态。

我似乎在Chrome中找不到任何类似的东西。我遗漏了什么吗?


当前回答

如果有帮助的话,这在最新的Chrome(47.0.2526.106)中似乎更容易:

检查元素,然后单击左侧排水沟中的三个白点:

然后从下拉菜单中选择所需的元素状态:

其他回答

我认为这在Chrome中不再是一个问题,只是以防万一。我写了这个jQuery脚本,当我用TAB键移动时检查DOM。

如果更改为使用'mouseover',将看起来像这样:

$("body *").on('mouseover', function(event) {       
    console.log(event.target);      
    inspect(event.target);
    event.stopPropagation();
});

您可以轻松地修改它,以便在单击或对想要停止的元素进行操作时删除事件处理程序。

编辑:这个答案是在错误修复之前,见tnotcutt的答案。这有点棘手,但如下所示:

右键单击元素,但不要将鼠标指针移离元素,保持悬停状态。 通过键盘选择检查元素,就像点击箭头,然后回车键。 在开发工具中匹配的CSS规则下,你应该可以看到:hover。

PS:我在你的一个问题标签上试过这个方法。

我用Chrome调试菜单悬停状态,这样做是为了能够看到悬停状态代码:

在元素面板上点击切换元素状态按钮并选择:悬停。

在“脚本”面板中,选择右下角的“事件侦听器断点”,然后选择鼠标->鼠标。

现在检查菜单并选择您想要的方框。当你释放鼠标按钮时,它应该会停止,并在元素面板中显示所选元素的悬停状态(请参阅样式部分)。

我知道我所做的是相当的变通,但它工作完美,这是我每次都做的方式。

然后,像这样进行:

首先确保Chrome开发工具是未停靠的。 然后,将Dev Tools窗口的任意一侧移动到你想要检查的元素中间。

最后,悬停元素,右键单击并检查元素,将鼠标移动到开发工具窗口,你将能够玩你的元素:悬停css。

干杯!

我认为没有办法做到这一点。我提交了一个功能请求。如果有办法的话,谷歌的开发人员肯定会指出来,我会编辑我的答案。如果没有,我们将不得不等待和观察。(你可以用星号来投票)


在10.0.620.0中,Styles面板显示了所选元素的:hover样式,但没有显示:active样式。


当前稳定频道版本为8.0.552.224。

你可以替换你的稳定频道安装的谷歌Chrome与Beta频道或开发频道(见早期访问发布频道)。

你也可以安装一个chrome的辅助安装,它甚至比Dev通道更最新。

... Canary版本的更新频率甚至比Dev频道还要高,并且在发布之前不会进行测试。因为金丝雀构建可能有时不可用,它不能设置为您的默认浏览器,可以安装在谷歌Chrome. ...的任何上述渠道之外