css中怎样让图片横起来

在网页设计过程中，放置图片是非常常见的一项任务。然而，如果图片竖着放，可能会对用户的浏览造成一些困扰，因此让图片横着放是一个更好的选择。接下来，我们将简要介绍使用CSS让图片横着放的方法。
首先，我们需要先选定要旋转的图片，然后在CSS文件中使用transform属性进行旋转。具体而言，我们可以使用rotate函数来让图片向右旋转90度，如下所示：

img {<br>
  transform: rotate(90deg);<br>
}<br> 

但是，这个方法有一个缺点，就是旋转后的图片并没有自动调整自己的位置。因此，我们需要使用CSS的position属性让图片水平对齐，并且将其定位到我们需要的位置。假设我们需要让图片靠在左侧，我们可以使用如下代码：

img {<br>
  transform: rotate(90deg);<br>
  position: absolute;<br>
  top: 0;<br>
  left: 0;<br>
}<br> 

这段代码可以让图片向右旋转90度，并且移动到页面左边。
但是，细心的读者可能会发现，上面这种方法并不能让图片横着放。原因在于，这个旋转操作只是让图片的视觉呈现方式旋转了90度，并没有真正地将图片转向横向。换而言之，虽然图片的表面是横着的，但其实图片的宽度还是竖着的宽度，这会导致一些问题。
为了解决这个问题，我们可以使用一个更加普遍的方法。我们可以用CSS3的transform属性来实现这个效果：

img {<br>
  transform: rotate(90deg) scaleX(-1);<br>
  filter: FlipH;<br>
}<br> 

上面这段代码会将图片旋转90度并且翻转水平方向，达到了我们想要的横向显示的效果。
总结一下，让图片横着放可以使用CSS的transform属性。我们可以使用rotate函数来让图片向右旋转90度，然后使用position属性来将其定位到需要的位置。但是，这样会有一些问题，因为图片的宽度仍然是竖着的。因此，我们可以使用两个方法来解决这个问题。一个方法是使用scaleX函数来水平翻转，另一个方法是使用filter属性的FlipH属性来实现水平翻转。