CSS可以讓字體旋轉90度，這樣的效果可以讓你的網頁看起來更加的獨特，接下來我們來一步步學習如何實現這個效果。

.rotate {
transform: rotate(90deg);
}

上面的代碼就是讓文本旋轉90度的核心代碼，我們將它封裝在一個css類名`.rotate`中，使得我們在需要應用這個效果的地方可以很方便的添加這個類名。

為了讓你更好的理解這個效果，我們可以展現一個實際的例子：

轉轉轉

.container {
height: 200px;
display: flex;
align-items: center;
justify-content: center;
background-color: #ccc;
}
.rotate {
font-size: 34px;
font-weight: bold;
text-decoration: none;
color: #fff;
padding: 10px;
background-color: #f00;
border-radius: 50%;
transform: rotate(90deg);
transition: all 0.3s;
}
.rotate:hover {
background-color: #00f;
transform: rotate(270deg);
}

上面的例子展示了如何將文本應用到容器中，容器是一個灰色的框，而文本則是由紅色轉變成藍色的，當鼠標懸浮在文本上面時，文本旋轉270度，變成上下顛倒的藍色。

這就是CSS如何讓字體旋轉90度的簡單示例，隨著你的掌握度的提高，你可以通過改變類、屬性等更改不同的屬性值，使你的網頁達到更為炫酷的效果。