Notice
Link
«   2024/04   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30
Archives
Today
Total
관리 메뉴

interactive

[CSS3] Transform 본문

Design

[CSS3] Transform

동그란우주 2012. 12. 3. 17:14

Transformations ( 변형 )

CSS3 에서는 기본 2D 변형을 지원 합니다.. translated, rotated, scaled, skewed 를 옵션으로 설정 할 수 있습니다.


transform: rotate( -30deg ); // 회전

transform: skew( 30deg , -10deg ); // 비스듬히 움직임


* border-radius 브라우저 버전별 확인

지원지원  = 지원     지원안됨  = 지원되지 않음     부분지원  = 부분지원   


IE 

 Firefox

Chrome 

Safari 

Opera 

ios
Safari 

Opera
Mini 

Android
Browser 

Blackberry
Browser 

        

2.1 -webkit-


  
   

3.2 
-webkit-

 

2.2 -webkit-

 
 

7.0

 


  

4.0-4.1
-webkit-

 

2.3 -webkit-

 
 

8.0

15.0 -mos-



 

4.2-4.3
-webkit-

 

3.0 -webkit-

 

9.0 -ms-

16.0

22.0
-webkit-

5.1 -webkit-


5.0-5.1 
-webkit-


4.0 -webkit-


current

10.0 

17.0 

23.0 
-webkit-

6.0 -webkit-

12.1

6.0 
-webkit-

5.0-7.0

4.1 -webkit-

7.0 -webkit-

near future

 

18.0 

24.0 
-webkit-
 

12.5

   

10.0-webkit-

farher future

 

19.0

25.0 
-webkit-
      



'Design' 카테고리의 다른 글

HTML5 오디오태그 <audio></audio>  (1) 2012.12.05
이미지 대체 사용 팁! placehold.it  (0) 2012.12.05
IR기법(Image Replacement)  (1) 2012.11.26
CSS로 배경투명하게 만들기  (1) 2012.11.15
[CSS3] background-size 속성알아보기  (0) 2012.11.14
Comments