Html 内容框、填充和窗口大小调整

我有一个图像，我需要从它的大小中排除填充

我使用：

    box-sizing: content-box;

问题是，当我调整浏览器的大小时，我希望图像的大小会缩小。使用上述内容框，当按预期调整浏览器大小时，图像不会收缩。只有在将浏览器拖入所有填充后，才会调整大小。这意味着一半的图像会离开屏幕

---

是否有一种方法可以使用内容框、填充并在浏览器调整大小时仍然调整图像的大小。

我不知道您是否需要：

可以使用框大小：边框框

---

或者，您可以使用媒体查询来控制图像大小

使用计算表达式将宽度设置为正确的值

img{
框大小：内容框；
最大宽度：300px；
填充：0 100px；
背景：绿色；
显示：块；
保证金：0px自动；
宽度：计算（100%-200px）；
}

---

谢谢，不幸的是，由于jquery插件正在计算图像的宽度，所以需要将其设置为内容框。

img{
  box-sizing: border-box;
  max-width: 300px;
  padding: 0 100px;
  background: green;
  display: block;
  margin: 0 auto;
  width: 100%;
}