2016-07-22 13 views
0

Я начинаю использовать sass, в момент, когда я начинаю открывать mixin и писать собственный. У меня есть подмешать:sass mixin - не все используемые аргументы

@mixin column-set ($number, $width, $gap, $rule-style, $rule-width, $rule-color, $col-span) { 
-webkit-column-count: $number;  /* Chrome, Safari, Opera */ 
-moz-column-count: $number;  /* Firefox */ 
column-count: $number; 
-webkit-column-width: $width;  /* Chrome, Safari, Opera */ 
-moz-column-width: $width;   /* Firefox */ 
column-width: $width; 
-webkit-column-gap: $gap;   /* Chrome, Safari, Opera */ 
-moz-column-gap: $gap;    /* Firefox */ 
column-gap: $gap; 
-webkit-column-rule-style: $rule-style; /* Chrome, Safari, Opera */ 
-moz-column-rule-style: $rule-style;  /* Firefox */ 
column-rule-style: $rule-style; 
-webkit-column-rule-width: $rule-width; /* Chrome, Safari, Opera */ 
-moz-column-rule-width: $rule-width;  /* Firefox */ 
column-rule-width: $rule-width; 
-webkit-column-rule-color: $rule-color; /* Chrome, Safari, Opera */ 
-moz-column-rule-color: $rule-color;  /* Firefox */ 
column-rule-color: $rule-color; 
-webkit-column-span: $col-span;   /* Chrome, Safari, Opera */ 
column-span: $col-span; 
} 

Я хотел бы использовать его, но не всегда со всеми аргументами, по этой причине я положил их в порядке, как я думаю, что я нуждаюсь в них. Но похоже, что когда я вызываю thins mixin, мне нужно ввести все аргументы. Есть ли способ избежать этого? например call1 @include column-set (3, 40px); call2 @ включить набор колонок (2, 40px, 10px, solid, 1px, синий);

Я пытаюсь найти там ответ, но без успеха. Может ли кто-нибудь помочь?

ответ

1

Вы можете установить значение по умолчанию, если не установлено значение в @include используется значение по умолчанию:

@mixin column-set ($number:3, $width:200px, $gap:20px){ 
... 
} 

Вы можете установить в null также.

@mixin column-set ($number:3, $width:null, $gap:null){ 
... 
} 

В включаемые можно назвать параметры, которые вы хотите использовать:

.class{ 
    @include column-set($gap:10px) 
} 

 Смежные вопросы

  • Нет связанных вопросов^_^