하는 SCS 믹스 인은

@mixin genericSidesStyles ($sides, $style, $cssProperty) { 
    @if($sides == '') { 
    $cssProperty: $style; 
    } 
    @else { 
    @each $side in $sides { 
     @if ($side == 'top' or $side == 'bottom' or $side == 'left' or $side == 'right') { 
     $cssProperty-#{$side}: $style; 
     } 
    } 
    } 
}

이것은 내가 아래로 내 믹스 인을 부르고 등 마진, 패딩, 국경하는 SCS 믹스 인은

같은 측면과 CSS 속성에 스타일을 부여하는 SCS들 믹스 인입니다

@include genericSidesStyles('top', 20px, 'margin');

여기

상단 여백 정상입니다, 20 픽셀 거리이며 마진은 cssProperty하지만 나는

예상 다음과 같은 오류가 점점 오전 ':'$ cssPr 후 operty-

할당 문에서하는 I 당신은 $cssProperty 변수를 보간하기 위해 필요한이

출처

2016-11-30 Saiyam Gambhir

나는 여러분의 믹스를 테스트했을 때,'@if ($ side == 'top'또는 $ side == 'bottom'또는 $ side == 'left '또는 $ side =='right ')'조건. '@ each' 루프를 제거하고 (왜 필요한지는 확실하지 않습니다.) & 잘 동작해야합니다. 또한 명세서를'# {$ cssProperty} - # {$ side} : $ style'로 변경하십시오. –

@NikhilNanjappa 루프가 여러 $ 쪽을 허용한다고 생각합니다. 이렇게하면 margin-top 및 margin-bottom 속성을 동시에 만들 수 있습니다. 두 값을 $ 쪽의 목록으로 전달합니다. –

'@custom '문에서'$ cssProperty'를 제거하여 답을 편집 했으니 이제 시작해야합니다. -'$ cssProperty - # {$ side} : $ style;'을' # {$ cssProperty} - # {$ side} : $ style;' –

잘못 어딘지 알려 도와주세요 (그래서 당신이 $side 변수했던 것처럼, #{$cssProperty}된다. 따라서 최종 코드는 다음과 같아야합니다 :

출처

2016-11-30 12:10:24

감사합니다. edmund하지만 각 라인마다 cssProperty가 필요 없습니다. 실수로 감사드립니다. –

@Nikhil it worked –

하는 SCS 믹스 인은

답변

관련 문제