-
CSSのtransformプロパティを使用する方法: div要素を回転させるためには、CSSのtransformプロパティを使用します。具体的な手順は以下の通りです。
Step 1: HTMLでdiv要素を作成します。
<div id="myDiv">回転するdiv要素</div>
Step 2: CSSでdiv要素を回転させるスタイルを指定します。
#myDiv { transform: rotate(90deg); }
これにより、div要素が90度回転します。
-
CSSのtransformプロパティとtransitionプロパティを組み合わせる方法: div要素をスムーズに回転させるためには、transitionプロパティを使用します。具体的な手順は以下の通りです。
Step 1: HTMLでdiv要素を作成します。(同じ要素を使用します)
<div id="myDiv">回転するdiv要素</div>
Step 2: CSSでdiv要素を回転させるスタイルとトランジションの設定を指定します。
#myDiv { transform: rotate(90deg); transition: transform 0.5s ease; }
これにより、div要素が0.5秒かけて90度回転します。