html - 检查 CSS :before 网页检查器中的元素

Question

有没有办法在 Chrome 或 FF 网络检查器中检查通过 CSS :before 选择器添加的元素并检查它们的计算样式（并即时操作它们）？

设置是

li:before {
    display: block;
    width: 50px;
    height: 50px;
    position: absolute;
}

所以它是没有任何 HTML 的真正块元素，但经过检查，他只选择了相关的 LI 元素。“力元素状态”-选项也不起作用，它仅适用于交互状态，如 :hover 但不适用于 :before

Answer 1

就在这里。检查元素本身（不是伪元素），伪元素的样式应该显示在下面，在继承的样式之前。

Answer 2

伪元素现在显示在 Chrome Inspector 中（从 Chrome 31 开始）。查看 Chrome 内置检查器中的伪元素。您还可以按预期编辑 css 属性。