[分享]css3怎么让图片旋转90度

CSS3是一种强大的样式表语言，可以用它来对HTML文档中元素进行样式控制。如果你想要让图片旋转90度，那么CSS3可以帮你实现这个效果。 要在CSS3中让图片旋转90度，可以使用transform属...

CSS3是一种强大的样式表语言，可以用它来对HTML文档中元素进行样式控制。如果你想要让图片旋转90度，那么CSS3可以帮你实现这个效果。
要在CSS3中让图片旋转90度，可以使用transform属性来实现。在CSS3中，transform属性有一个rotate()函数，可以用来对元素进行旋转。下面我们来看一下如何使用它。
首先，我们需要准备一张图片。假设我们有一个id为“my-img”的图片元素，我们可以给它加上如下的CSS样式来让它旋转90度：

#my-img {
  transform: rotate(90deg);
} 

在上面的代码中，我们使用了CSS3的transform属性，并在rotate()函数中指定了旋转的角度。这个角度可以使用度数、弧度或百分比来表示。在这个例子中，我们使用了90度。
请注意，在使用transform属性时，需要添加浏览器前缀（-webkit-、-moz-、-ms-、-o-），以确保在不同浏览器中都能正确地显示效果。
如果你想要在hover状态下对图片进行旋转，可以使用CSS3的:hover伪类。例如，下面的代码将会在鼠标悬停在图片上时将其旋转90度：

#my-img:hover {
  transform: rotate(90deg);
} 

总之，使用CSS3的transform属性可以轻松地让图片旋转90度。如果你想了解更多关于CSS3的样式技巧，可以继续学习和探索。