CSS中我們可以使用transform屬性來實現圖片的旋轉,包括打橫和打豎,本文將講解如何使用transform屬性來實現圖片打豎。
.img-rotate { transform: rotate(90deg); }
我們可以先在HTML中插入圖片:
<img src="example.jpg" class="img-rotate" />
在CSS中,我們為圖片設置一個類名,這里我們命名為img-rotate。通過transform: rotate(90deg)來旋轉圖片,90度表示旋轉角度,可以根據實際情況進行調整。此處的值為正90度,表示圖像將被順時針旋轉90度,如果需要逆時針旋轉,則將值改為負數。
通過運用transform屬性的rotate旋轉函數,我們便可以在CSS中輕松實現圖片打豎的效果。
上一篇css塊狀文章列表樣式