回転させる方法 90度?質問する

回転させる方法 90度?質問する

<div>90 度回転させたいものがあります:

<div id="container_2"></div>

これどうやってするの?

ベストアンサー1

これを実現するには CSS が必要です。例:

#container_2 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

デモ:

#container_2 {
  width: 100px;
  height: 100px;
  border: 1px solid red;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
<div id="container_2"></div>

(デモでは45度回転するので、効果を確認できます)

注:および-o--moz-接頭辞はもはや関連性がなく、おそらく必要ではないIE9では-ms-SafariとAndroidブラウザでは-webkit-


2018 年更新:ベンダー プレフィックスはもう必要ありません。 のみでtransform十分です。(@rinogo に感謝)

おすすめ記事