CSS3「transform」のまとめ

ベンダープレフィックスは省略しています。

transform: rotate();・・・XとYを同時に指定
transform: rotateX();
transform: rotateY();

    #txt01 {
    	animation: animation01 2s infinite ease 1s both;
    }
    @keyframes animation01 {
    	from {
    		transform: rotate(0deg);
    	}
    	to {
    		transform: rotate(360deg);
    	}
    }

      #txt02 {
    	animation: animation02 2s infinite ease 1s both;
    }
    @keyframes animation02 {
    	from {
    		transform: rotateX(0deg);
    	}
    	to {
    		transform: rotateX(360deg);
    	}
    }

         #txt03 {
    	animation: animation03 2s infinite ease 1s both;
    }
    @keyframes animation03 {
    	from {
    		transform: rotateY(0deg);
    	}
    	to {
    		transform: rotateY(360deg);
    	}
    }

WEB Drawer