CSS3旋轉(zhuǎn)圖像的方法

在CSS3中，我們可以使用transform屬性來實現(xiàn)圖像的旋轉(zhuǎn)，以下是一些示例代碼，展示了如何旋轉(zhuǎn)圖像：

1、旋轉(zhuǎn)90度：

img {
  transform: rotate(90deg);
}

2、旋轉(zhuǎn)180度：

img {
  transform: rotate(180deg);
}

3、旋轉(zhuǎn)270度：

img {
  transform: rotate(270deg);
}

4、旋轉(zhuǎn)360度：

img {
  transform: rotate(360deg);
}

這些代碼可以將圖像旋轉(zhuǎn)指定的度數(shù)，如果你想旋轉(zhuǎn)任意角度，可以使用以下公式：旋轉(zhuǎn)度數(shù) = 180度(n % 2) + 旋轉(zhuǎn)方向 * 旋轉(zhuǎn)度數(shù)，其中n是旋轉(zhuǎn)次數(shù)，旋轉(zhuǎn)方向可以是正數(shù)或負數(shù)，表示順時針或逆時針旋轉(zhuǎn)，如果你想旋轉(zhuǎn)240度，可以使用以下代碼

img {
  transform: rotate(240deg);
}

如果你想復(fù)制圖像，可以使用以下代碼：

img {
  transform: rotate(0deg) scale(1, 1) translate(0, 0); /* 旋轉(zhuǎn)0度并縮放1倍，移動到原點 */
  position: absolute; /* 將圖像定位在***位置 */
  top: 0; /* 將圖像定位在頂部 */
  left: 0; /* 將圖像定位在左側(cè) */
}

這段代碼將圖像旋轉(zhuǎn)0度并縮放1倍，然后將其移動到原點，將圖像定位在***位置，并將其顯示在頂部和左側(cè)，如果你想將圖像復(fù)制到其他位置，可以修改top和left屬性的值。