样式化的组件是否嵌套样式？

Question

使用样式化组件时，对于较大的可伸缩应用程序，哪种方法更好？为每个html标签创建单独的变量，还是仅将CSS嵌套在变量中？

例如：我具有以下简单结构：

ul {
  li {
    a {

    }
  }
}

const list = styled.ul`
   padding: 0;
   li {
    padding: 10px 0;
      a {
        color: black;
      }
   }
`

OR

 const list = styled.ul`
       padding: 0;
    `

const listLi = styled.li`
       padding: 10px;
    `

const listA = styled.a`
       color: #333;
    `

Answer 1

尽可能少地分开，并多次组合。 这将使您易于重用项目中的组件。