css 图片 宽度高度等于宽度

CSS 中的图片是非常常见的元素。当我们在编写 CSS 样式时，通常需要设置图片的宽度和高度。如果我们想要让图片的宽度和高度等于宽度，那么该怎么做呢？

img {
  width: 100%;
  height: auto;
}

上面的代码可以帮助我们实现这一目的。通常情况下，我们可以将图片的宽度设置为百分比，就像上面代码中的 100% 一样。这样可以确保图片的宽度始终等于容器的宽度。

另外，我们还需要将图片的高度设置为自动。这样可以确保图片的高度随宽度自适应，不会导致图片变形。

img {
  max-width: 100%;
  height: auto;
}

除了以上的代码，我们还可以使用 max-width 属性来确保图片的宽度。这样当容器比图片宽时，图片的宽度不会超出容器的宽度。

总的来说，当我们需要让图片的宽度和高度等于宽度时，我们需要使用 width: 100%; 和 height: auto; 这样的 CSS 属性，来确保图片自适应容器大小。