2011-12-26 5 views
1

이 두 문장의 집합이 동등한 지 궁금합니다. 나는 그들이 그랬다고 생각했지만 그들은 다른 일을하는 것처럼 보였다.css3은 transform에 해당하는이 두 문장입니까?

-webkit-transform: rotate(45deg); 
-webkit-transform: translateX(200px); 
-webkit-transform-origin:0% 100%; 

및 ...

-webkit-transform: rotate(45deg) translateX(200px); 
-webkit-transform-origin:0% 100%; 

이 문장의 첫 번째 세트 만 translateX 수행 및 회전 가도록 것 같습니다하지 않습니다. 나는 첫 번째 명령문 집합에 대한 명령을 바꿨다. ...

-webkit-transform: translateX(200px); 
-webkit-transform: rotate(45deg); 
-webkit-transform-origin:0% 100%; 

그리고 그것은 단지 회전을 수행하는 것으로 보입니다. 그것은 단지 후자를합니까? 그러나 쓰는 것에 의해 ...

그것은 첫번째로 회전하고 그 다음 translateX를한다. 나는 이것이 이것을 작성하는 속기 일 뿐이라고 생각했다. 그렇지 않니?

여기 코드 링크가 있습니다. 정말 간단합니다. http://jsfiddle.net/gCeUe/2/

감사합니다.

color: red; 
color: green; 
color: blue; /* This is what the color will be */ 

이 같은 코드를 작성 : 명확하고 철저한 도움을 많이 마지막 문이 렌더링되는 하나되도록

답변

3

CSS는 방법으로 구문 분석) = 평가 될 것입니다 :

-webkit-transform: rotate(45deg); 
-webkit-transform: translateX(200px); 

-webkit-transformrotate(45deg) 설정하고 translateX(200px) 덮어 쓰기된다.

-webkit-transform: rotate(45deg) translateX(200px); 
+0

아 난 참조 :

이는 올바른 신택스이다. 감사! 그건 의미가 있습니다. 덮어 쓰는 색상에 대해 알고 있었지만 초기에 덮어 쓰기 대신 변환을 추가한다고 생각했습니다. – Sasha

관련 문제