css - 了解 CSS 语法 & + &

Question

我正在查看 .css 文件中的以下选择器:

.tab {

    flex: 1 0 auto;
    height: 52px;

    & + & {
        border-left: 1px solid;
    }

}

我不熟悉 & + & {} 的语法——它是什么意思？

Answer 1

这不是 CSS，而是一些要编译成 CSS 的文件。它可能是 SCSS 或更少。

在SCSS和 Less , & 只是封闭选择器的重复。

所以

& + & {
    border-left: 1px solid;
}

会被翻译成

.tab + .tab {
    border-left: 1px solid;
}

当您需要在元素之间添加边框时，这种结构很常见:您可以将它添加到任何元素的左侧，然后是另一个元素。

introduction to the sass/less ampersand