덜 스타일 시트 언어 : 컴파일 된 CSS에서 괄호가 생략되지 않도록

{less}을 (를) 사용 중이며 괄호 사용에 문제가 있습니다. 나는 CSS3 변환 속성을위한 mixin을 썼다. 컴파일 된 CSS에서 괄호를 사용하는 방법을 알 수 없습니다. Less는 괄호를 연산으로 간주하고 생략합니다.덜 스타일 시트 언어 : 컴파일 된 CSS에서 괄호가 생략되지 않도록

원래 CSS :

.plus { 
     -webkit-transform: rotate(45deg); 
     -moz-transform: rotate(45deg); 
     -o-transform: rotate(45deg); }

적은 믹스 인이 내가 쓴 :

.transform (@action, @value){ 
     -webkit-transform: @action(@value); 
     -moz-transform: @action(@value); 
     -o-transform: @action(@value); }

및 결과 컴파일 된 CSS :

.plus { 
     -webkit-transform: rotate 45deg; 
     -moz-transform: rotate 45deg; 
    -o-transform: rotate 45deg; }

출처

2013-04-30 Alan

그냥 하나의 값으로 유지하고 전화를 걸 때 필요한 것을 전달하면됩니다.

.transform(@value) { 
    -webkit-transform: @arguments; 
    -moz-transform: @arguments; 
    transform: @arguments; 
} 

.plus { 
    .transform(rotate(45deg)); 
    .transform(scale(1.5, 2.0)); 
}

는

이 작품

.plus { 
    -webkit-transform: rotate(45deg); 
    -moz-transform: rotate(45deg); 
    transform: rotate(45deg); 
    -webkit-transform: scale(1.5, 2); 
    -moz-transform: scale(1.5, 2); 
    transform: scale(1.5, 2); 
}

출처

2013-04-30 01:56:41 ferne97

로 컴파일합니다. 나는 여전히 논쟁과 그 이하의 나머지에 대해 내 머리를 싸려고 노력 중이다. 나는 프로그래머가 아니므로 나를 어리 석 게 만들었습니다. thanks – Alan

'@ arguments' 변수를 사용하는 것은 mixin의 모든 인수를 전달하는 쉬운 방법입니다. 필자의 예제에서는 하나만 존재하기 때문에 실제로 필요하지는 않습니다. 단지'@ value' 변수를 호출 할 수도 있습니다. – ferne97

키 (이런 일에 믹스 인을 변경

문자열로 작성한 다음 이스케이프 된 값을 사용합니다.)

.transform (@action, @value){ 
    @escapedValue: ~"@{action}(@{value})"; 
    -webkit-transform: @escapedValue; 
    -moz-transform: @escapedValue; 
     -o-transform: @escapedValue; 
}

출처

2013-04-30 00:42:48 ScottS

덜 스타일 시트 언어 : 컴파일 된 CSS에서 괄호가 생략되지 않도록

답변

관련 문제