2016-07-26 11 views
0

私たちは負の符号を反時計

transform : rotate(-20deg);

を使用して要素を反時計回りに回転させることができます知っている。しかし、これはX軸のみのためです。 y軸に沿って要素を回転させたい

transform : rotateY(20deg);

を私は半時間のための答えを探しています:私は、これは我々が使用していると、それは同じ方向に要素を回転させる働きはありません

transform : rotateY(-20deg);

を試してみました。助けてください。

+0

それはあなたがそれを手助けするのは難しい達成しようとしているが何であるかを見なければ、あなたのYのrotattionは動作するはずですが、おそらくあなたがそれが必要だと思うものを示していません。 - http://codepen.io/Paulie-D/pen/QEAXkV –

+0

私の質問は基本的に 'transform:rotateY(20deg)'と 'transform:rotateY(-20deg)'両方で要素を同じ方向に回転させます。私は反対方向の方向に回転したい。それを試してみてください。 –

+0

問題のデモを行う必要があります。回転Yは回転Xと同じ効果がありません。 –

答えて

-1

どうしてですか?します。それとも要素を伸ばしたいですか?その後、transform:scale()がお手伝いします。

div{ 
 
    transform: scale(2,1); 
 
    margin-left:200px; 
 
}
<div>text</div>

あなたがtransform : rotate(-20deg);を使用

0

(スケーリングは、画面オフ要素をプッシュするので、また左マージンを追加する)、あなたはそれがonly for x-axis.

そうだと言ったあなた質問は:I want to rotate element along the y-axis. divを垂直に回転させたい場合は、以下のコードを参考にしてください。

.rotate-vertically { 
 
    height:100px; 
 
    width:100px; 
 
    background:red; 
 
    padding:10px; 
 
    text-align:center; 
 
    transition: all 1.0s linear; 
 
    
 
} 
 

 
.rotate-vertically:hover { 
 
    transform:rotateX(180deg); 
 
}
<div class="rotate-vertically">Hover me! 
 
</div>

詳しい情報here

関連する問題