CSS 圖片旋轉放大縮小
CSS 是 Cascading Style Sheets 的縮寫,是一種針對網頁設計的樣式表語言。它使得我們可以為 HTML、XML 和 SVG 等文檔描述風格。
在 CSS3 中,我們可以通過 transform 屬性來實現圖片的旋轉、放大和縮小。
旋轉圖片
使用 transform 的 rotate() 函數可以實現圖片的旋轉。在下面的例子中,我們使用 rotate(45deg) 將圖片逆時針旋轉 45 度。
img { transform: rotate(45deg); }放大圖片 使用 transform 的 scale() 函數可以實現圖片的放大。在下面的例子中,我們使用 scale(1.5) 將圖片放大到原來的 1.5 倍大小。
img { transform: scale(1.5); }縮小圖片 使用 transform 的 scale() 函數可以實現圖片的縮小。在下面的例子中,我們使用 scale(0.5) 將圖片縮小到原來的一半大小。
img { transform: scale(0.5); }通過以上三個例子,我們可以看到 transform 屬性非常方便,可以用來實現圖片的各種變換效果。