2011-08-20 9 views
3

아래의 믹스 인에서 여러 인수를 전달합니다. CSS 파일의 여러 위치에서 믹스 인을 호출합니다. 때로는 모든 args를 지정할 필요가 있으며, 다른 경우에는 몇 번만 지정하면됩니다. 루비는 해시를 사용하여 선택적 args를 전달할 수있게합니다. SASS에 이와 같은 기능이 있습니까? 아니면 이름 지정된 인수를 순서없이 전달할 수 있으며, 기본값을 가진 인수는 생략 할 수 있습니까?SASS 믹스 인 인수

@mixin three-column-header-layout($background_color: #EEEEEE, $left_width: 25%, $mid_width: 50%, $right_width: 25%, $left_line_height: 40px, $mid_line_height: 40px, $right_line_height: normal, $column_height: 40px) { 
    .wrapper { 
    margin: 0 auto; 
    width: 100%; 
    overflow: hidden; 
    } 

    .middleCol { 
    float: left; 
    background: $background_color; 
    height: $column_height; 
    width: $mid_width; 
    display: inline; 
    line-height: $mid_line_height; 
    } 

    .leftCol { 
    background: $background_color; 
    height: $column_height; 
    width: $left_width; 
    float: left; 
    line-height: $left_line_height; 
    } 

    .rightCol { 
    background: $background_color; 
    height: $column_height; 
    width: $right_width; 
    float: left; 
    line-height: $right_line_height; 
    } 
} 

답변

1

Sass의 유일한 데이터 구조는 3.1.7입니다.

언급 한대로 전달되지 않은 모든 인수에 기본값이있는 경우에만 명명 된 인수의 조합을 사용하여 mixin을 포함시킬 수 있습니다.

0

말대꾸 3.3 맵핑 데이터 구조를 추가하고이 같은 유지 mixin에 인수로 전달할 수 있습니다

$options: 
    (background_color: red 
    , right_width: 30% 
    , left_width: 20% 
); 

.foo { 
    @include three-column-header-layout($options...); 
} 

참고하지만, 하나는 (이것은 3.2되었을 수도과 같이 인수를 지정할 수 있음 기능) :

.foo { 
    @include three-column-header-layout($background_color: red, $right_width: 30%, $left_width: 20%) 
}