什么'；组合CSS多个伪元素的正确方法是什么？

我已经为下面的页面创建了一个代码。它工作得很好，但我想优化它，我不知道，因为我不是程序员。正确的方法是什么

#black:before {
content: ""; 
position: fixed;
top: 0; 
right: 0; left: 0; bottom: 0; background: none; 
z-index: -2;}

#red:before {
content: ""; 
position: fixed;
top: 0; 
right: 0; left: 0; bottom: 0; background: none; 
z-index: -2;}

 #black:target::before {background: #ACAA92;}
 #red:target::before {background: #ACAA92;}

 #black:hover .text{display:block;} 
 #com:hover .text{display:block;}

---

所有应该共享相同属性和值的选择器都可以用逗号分隔。您可以将它们全部写在一行上，但更可取的样式是将每一行放在自己的行上，以帮助可读性：

#black:target::before, #red:target::before { background: #ACAA92; }

#black:hover .text,
#com:hover .text {
  display:block;
}

---

“优化它”的方式是什么？我不知道是否有办法将所有这些伪元素组合到一行代码中。在这个例子中，我只是每个放了两个，但实际上它们是21。您忘记了ID

s。