Аргументы
Миксины могут принимать значения SassScript как аргументы, которые передаются при подключении миксина и становятся доступными как переменные внутри него.
При определении миксина, аргументы пишутся как имена переменных, разделённые запятыми внутри круглых скобок сразу после имени. Затем, при подключении миксина, значения могут быть переданы аналогичным образом. Например:
@mixin sexy-border($color, $width) {
border: {
color: $color;
width: $width;
style: dashed;
}
}
p {
@include sexy-border(blue, 1in);
}
@mixin sexy-border($color, $width)
border:
color: $color
width: $width
style: dashed
p
@include sexy-border(blue, 1in)
p {
border-color: blue;
border-width: 1in;
border-style: dashed;
}
В миксинах также можно определять значения аргументов по умолчанию, используя обычный синтаксис установки значений переменных. Затем, при подключении миксина, если ему не будет передан аргумент, то будет использовано значение по умолчанию.
@mixin sexy-border($color, $width: 1in) {
border: {
color: $color;
width: $width;
style: dashed;
}
}
p {
@include sexy-border(blue);
}
h1 {
@include sexy-border(blue, 2in);
}
@mixin sexy-border($color, $width: 1in)
border:
color: $color
width: $width
style: dashed
p
@include sexy-border(blue)
h1
@include sexy-border(blue, 2in)
p {
border-color: blue;
border-width: 1in;
border-style: dashed;
}
h1 {
border-color: blue;
border-width: 2in;
border-style: dashed;
}
Поддержка