Понимание синтаксиса CSS & + &

Question

Я смотрю на следующий селектор из файла .css:

.tab {

    flex: 1 0 auto;
    height: 52px;

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

}

Я не знаком с синтаксисом & + & {} - что это значит?

Answer 1

Это не CSS, а какой-то файл, предназначенный для компиляции в CSS. Это, вероятно, SCSS или Меньше.

В SCSS и Меньше , & является просто повторением включающего селектора.

Итак

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

будет переведено как

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

Эта конструкция является обычной, когда вам нужно добавить границу между элементами: вы добавляете ее слева от любых элементов, следующих за другим.

введение в sass / less амперсанд