html - 自动调整父 div 的大小

Question

我想将调整大小的子图像放在父 div 中。我如何让这个父 div 与子图像相同，而不是更大？有关示例，请参见下面的代码段。谢谢。

div {
  border: 1px solid blue;
  width: auto;
  height: auto;
  display: inline-block;
  overflow: auto;
}

img {
  background-color: orange;
  width: 80%;
  height: 80%;
  overflow: auto;
}

<div>
  <img src="https://www.python.org/static/opengraph-icon-200x200.png" />
</div>

Answer 1

在这种情况下，您需要让 img 的 width 为 100% 并且 width code> 或 80% 的东西:

div {
  border: 1px solid blue;
  width: auto;
  height: auto;
  display: inline-block;
  overflow: auto;
}

img {
  background-color: orange;
  display: block;
}

<div>
  <img src="https://www.python.org/static/opengraph-icon-200x200.png" />
</div>

预览