CSS：背景图像伸展和南瓜100％面积的div没有溢出没有重复

我想有一个图形形状背景图像拉伸，以适应响应动态变化的div（包含文本）的整个区域没有任何需要保留的比例，以使图像保持100％的宽度和高度而不会溢出。CSS：背景图像伸展和南瓜100％面积的div没有溢出没有重复

我已经尝试使用通常的背景大小设置为'包含'，'包含'和'100％100％'，但这些似乎都保留了比例。我认为“100％100％”可以做到这一点，但是当宽度缩小并且文字覆盖更多行时，高度不会拉伸。

这可能吗？

非常感谢！

2017-07-28 AndyiBM

background-size：100％100％;请参阅：https://stackoverflow.com/questions/1150163/stretch-and-scale-a-css-image-in-the-background-with-css-only – VA79

我不确定这是否可以帮助你，但采取看看'对象适合'https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit –

谢谢Muthu ...不适用于背景图片，但它真的要求是背景大小的另一种选择。 – AndyiBM

还可以尝试

背景尺寸：100％100％用

体{宽度：100％;高度：100％;}

或

使用object-fit：fill;

填充：整个对象将完全填充框。如果对象的宽高比与其长宽比不匹配，则该对象将被拉伸以适合其宽高比。

2017-07-28 11:18:39

或尝试背景大小：100％100％与身体{宽度：100％;高度：100％;} –

谢谢Raushan，但对象适合没有效果 - 我怀疑它不适用于背景图像。我已经尝试添加宽度：100％和高度：100％，以使用背景大小：100％100％，但不会将图像伸展到边缘。我想知道是否有一些其他属性设置妨碍了它的正常工作。我需要更近一点。 – AndyiBM

找到了！我滑入一个.svg背景图片（与png后备），但svg不会重塑自己。当我删除它时，png会根据需要重新调整/调整大小。 – AndyiBM

回答