デザインを回転させる
transform: rotate()で回転させることができる。
<style>
.rotate {
background-color: #00ff00 ;
width: 50px;
height: 50px;
transform: rotate(-15deg);
}
</style>
<div class="rotate">aa</div>
![](https://assets.st-note.com/img/1696340959401-gLVUYsHWNj.png)
transform: rotateX()で軸を回転することも出来る。
<style>
.rotate {
background-color: #00ff00 ;
width: 50px;
height: 50px;
transform: rotate(180deg);
}
</style>
<div class="rotate">aa</div>
![](https://assets.st-note.com/img/1696341088012-HMyuUKFLcM.png)
この記事が気に入ったらサポートをしてみませんか?