html - sass 冒号 vs & 冒号

Question

我正在使用 sass 来设置元素，并且对:and&:以及何时适合使用它们感到困惑。

有什么区别？我们什么时候应该使用哪一个？

.root{

    :first-child{
        color: green;
    }
    
    &:first-child{
        color: green
    }
}

哪个适合选择root容器的第一个孩子

标签： htmlcsssass

Answer 1

原来没有:vs&:

相反，有效的是&:

&:first-child{
    color: green
}

和下面显示的一个，:没有&是无效的

:first-child{
    color: green;
}

//this one is an invalid code and doesn't work