为什么css＆＃34;重置＆＃34;销毁选择optgroup？

Question

在我的主要css文件中找到了这个代码 - 不知道它是如何进入的或为什么，但它看起来像是重置。漂亮的是，尽管内容是一个空字符串，但它完全是选择optgroups。

检查出来：

＆＃13;

＆＃13;

<style> *::after,
*::before {
  content: '';
}
</style>

＆＃13;

<select>
  <optgroup label="Swedish Cars">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
  </optgroup>
  <optgroup label="German Cars">
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
  </optgroup>
</select>

＆＃13;

＆＃13;

＆＃13;

https://jsfiddle.net/des2016/d3e6z3ay/

而且，哦，好玩，它只在Firefox上执行此操作。

1. 这个css应该为我们做什么？
2. 为什么会破坏optgroups？

Answer 1

*用于表示所有元素。

::before创建一个伪元素，该元素是匹配元素的第一个子元素，::after伪元素匹配所选元素的虚拟最后一个子元素。

它通常用于通过使用content属性向元素添加化妆品内容。默认情况下，此元素是内联的。

下面的代码中添加了＆＃39;＆＃39; （无）所有元素之前和之后。

<style> *::after,
*::before {
  content: '';
}
</style>

在firefox中，只有在这个特殊情况下，似乎正在讨厌的是，当你把一些东西分开时，你会破坏它的元素。