CSS可以对图片进行水平旋转,即图像沿着纵轴中心线翻转180度,这可以通过transform属性的rotateY函数实现。
img { transform: rotateY(180deg); }
上述代码将会对选择器匹配的所有图片进行水平旋转。
如果需要对特定的图片进行水平旋转,可以给该图片设置一个class或者id,然后在CSS中使用该class或id进行选择。例如:
<img src="example.jpg" class="mirror"> .mirror { transform: rotateY(180deg); }
上述代码将会对class为mirror的图片进行水平旋转。
注意,rotateY函数中的参数为角度值,可以是正数或负数,如果是正数则沿着纵轴逆时针旋转,如果是负数则沿着纵轴顺时针旋转。
使用CSS对图片进行水平旋转,可以实现一些特殊的效果,例如制作镜像效果等。