当先锋百科网

首页 1 2 3 4 5 6 7

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对图片进行水平旋转,可以实现一些特殊的效果,例如制作镜像效果等。