我创建了一个div(div1),它等于浏览器窗口大小.然后我在父div(div1)中创建了另一个div(div2).然后我在第二个div(div2)中放置了一个图像.我的浏览器窗口大小为1360X638,我的图像大小为1600*1200.
我希望图像根据父div(div1)的大小来适应自己.所以图像(大于窗口大小)必须适合第二个div(div2),它等于窗口大小),这个图像将完全适合div的大小(所以,没有任何滚动或裁剪显示中的图像).
我搜索了一段时间.我找到的解决方案是将最大高度和宽度设置为100%.我这样做了
我写了这部分:
<div style="max-width: 100%; max-height: 100%; background-color: red; margin-right: 0px; padding: 2 2 2 2; overflow:visible;">
<div style="max-height: 100%; max-width: 100%;">
<img style="max-width: 100%; max-height: 100%; overflow:visible;" src="1.jpg" />
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
输出是这样的:

您可以看到右侧有一个滚动条.我不希望那里.