如何获得显示实际尺寸的图像？

Question

我在div中有一张图片，我的图片最大尺寸为40％。如何获得实际尺寸的图像？

.v-guide img {
    width: 40%;
    border: 1px black solid;
    float: left;
    margin: 0 12px 0 0;
    }

这是我的风格。如何在img标签中添加样式以具有图像实际样式，甚至最大尺寸为80％？

Answer 1

只需将max-width添加到样式中，而不用width强制其宽度。

img {
  max-width: 80%;
}

div {
  border: 1px solid red;
}

<div>
  <div>
  <img src="http://via.placeholder.com/1000x150">
  <img src="http://via.placeholder.com/350x150">
  <img src="http://via.placeholder.com/10000x150">
  </div>
</div>