html - 有没有办法使用鼠标使伪元素在 Chrome 开发者工具中可见？

Question

我试图找出计算元素位置的位置，例如将鼠标悬停在代码窗口中元素的代码行上，以便显示边距、填充等。有没有办法为伪元素做到这一点？

编辑：我应该说的是我想查看伪元素的指标、属性等窗口：before 和 :after。我真正想要的只是在屏幕上看到他们的位置。

Answer 1

对之前/之后元素的支持即将推出！你应该在下个月左右的 Canary 上拥有它！

Answer 2

是的，有一种方法可以使用 chrome devtools 强制元素状态；如果您查看右侧，您应该会在“样式”选项卡上看到一个看起来像光标的图标，其后面有一个破损的框。

当您单击它时，它将有一个下拉菜单，允许您切换所选代码的悬停、活动、焦点和访问的伪类。