如何避免重复是css？

Question

如何避免以下CSS重复：

div#logo div:nth-child(1) div {
    width: 30%;
    height: 30%;
    background-color: white;
}

div#logo div:nth-child(3) div {
    width: 30%;
    height: 30%;
    background-color: white;
}

Answer 1

您可以将此用于1,3,5,7 ....就像div:nth-child(2n+1)以2（0）+ 1 = 1开始然后加2（1）+1 = 3,2（2）+ 1 = 5续... 。

div#logo div:nth-child(2n+1) div{
    width: 30%;
    height: 30%;
    background-color: white;
}

Answer 2

您可以组合这些语句，如下所示：

div#logo div:nth-child(1) div, div#logo div:nth-child(3) div{
  width: 30%;
  height: 30%;
  background-color: white;
}

Answer 3

div#logo div:nth-child(odd) div {
    width: 30%;
    height: 30%;
    background-color: white;
}