Question

当我检查类.mlm-clearfix的div时，firebug在右侧面板中显示此类名及其URL两次。为课程提供的Easy Clear Method的样式声明是

.mlm-clearfix:before,
.mlm-clearfix:after {
   content: '\0020';
   display: block;
   overflow: hidden;
   visibility: hidden;
   width: 0;
   height: 0; 
}

当我删除一个选择器并将其修改为

时

.mlm-clearfix:after {
   content: '\0020';
   display: block;
   overflow: hidden;
   visibility: hidden;
   width: 0;
   height: 0; 
}

问题消失了。但是这种情况并没有发生在其他组合类选择器上，比如

.search-table td input,
.search-table td select {
    width: 200px;
}

css文件未链接两次。这可能是什么原因？请帮忙。

Answer 1

:before和:after是pseudo-elements。（它们的正确语法实际上是::before和::after）。包含它们的选择器不会为所选元素本身设置样式，而是定义将要设置样式的新元素。

Firefox API Firebug（2.0.x）内部uses仅允许获取给定伪元素的所有样式。虽然Firebug不会检查是否已存在与另一个伪元素相同的规则。因此规则将在Style side panel内显示两次。

只要这些伪元素显示在HTML panel内的HTML结构中，而不是 Style 侧面板中，就会解决此问题（请参阅issue 5785）。

Firebug在右侧面板中显示两次类名及其位置

1 个答案: