css中img如何里外旋转

在CSS中，我们可以使用transform属性来旋转元素。对于img标签，同样也可以使用该属性来进行内外旋转。
下面我们可以使用pre标签插入代码，来演示如何实现旋转效果。

//CSS代码
/* 将图片垂直翻转 */
img {
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
}

/* 逆时针旋转45度 */
img {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

/* 同时内外旋转 */
img {
  -webkit-transform: rotate(-45deg) scaleY(-1);
  transform: rotate(-45deg) scaleY(-1);
}

在上述代码中，我们首先使用transform属性对图片进行垂直翻转和旋转。具体来说，scaleY(-1)的作用是将图片沿着垂直方向翻转，而rotate(-45deg)则是将图片逆时针旋转45度。如果我们想要同时实现内外旋转的效果，那么只需要将两个样式结合即可。

最后需要注意的是，transform属性会改变元素的布局和位置，所以在进行旋转操作时需要特别小心。为了避免出现意外的运算结果，可以使用transition属性来平滑过渡旋转过程。