Что означает "@include " in.файлы css?

Я не понимаю, что означает тег @include .файл CSS. Например:

.wrapper {
display: flex;
width: 100%;
@include display(flex);
@include flex-direction(column);
@include align-items(center);
@include justify-content(center);
@include transition(all 2s linear);
}

1 ответов


@includes являются частью SCSS, это называется Mixin. Вот пример:

@mixin border-radius($radius) {
    -webkit-border-radius: $radius;
       -moz-border-radius: $radius;
        -ms-border-radius: $radius;
            border-radius: $radius;
}

.box { @include border-radius(10px); }

@includes-это ярлык для хранения особенно таких вещей, как префиксы поставщиков. Вывод CSS из вышеизложенного будет:

.box {
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
        -ms-border-radius: 10px;
            border-radius: 10px;
}