Javascript 内联flexbox模型中背景图像的宽度

是否可以仅使用css从背景图像计算元素的最小宽度

在占据整个视口高度的内联flexbox包装中，我们可以使用javascript根据背景图像的（w/h）比例计算每个子div的相对宽度

var scale = ((img.naturalWidth / img.naturalHeight) * 100);

然后使用css3视口高度将其应用于元素

element.style.minWidth = scale + 'vh';

因此，如果图像是

130px宽度x 100px高度

，则应用于div的最小宽度是

130vh

在没有javascript的情况下，能否实现基于背景图像宽度的布局

---

用小提琴演示：

缩放背景图像以适应div：

背景尺寸：包含

---

要缩放背景图像以覆盖整个div，请执行以下操作：

---

背景尺寸：封面

嗨，W3，谢谢你的洞察力。我实际上是想弄清楚如何使用背景图像来确定元素的精确宽度，因此理论上，背景大小和封面都可以达到相同的美学效果。