Question

我为跟随Stackoverflow答案的页面创建了代码。它工作得很好，但是我想对其进行优化，因为我不是程序员，所以我不知道。正确的方法是什么？

#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;}

Answer 1

所有应该共享相同属性和值的选择器都可以简单地用逗号分隔。您可以将它们全部写在一行上，尽管更受欢迎的样式是将每一行都放在自己的行上以提高可读性：

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

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

https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Combinators_and_multiple_selectors#Groups_of_selectors_on_one_rule

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

1 个答案: