Question

我想制作一个横幅，可以将其扩展到全屏，而不依赖于分辨率。

<body>
    <div class="div_left"></div>
    <div class="div_middle_fixed"></div>
    <div class="div_right"></div>
</body>

这是一个带有jpg的div，它位于屏幕中央，固定大小为1000px。我需要使用其他2个图片（动态大小的div）将此横幅“展开”到全屏幕。我需要一个在我的固定横幅的开头，它向左扩展动态。第二个是我固定横幅的末尾，它向右扩展了动态。

我需要这个技巧，所以横幅的图形必须在adges匹配

我该怎么做？

Answer 1

我建议使用图片作为这些div的背景，依此类推使用此CSS属性，以便在缩放网站时保留它：

background-size: contain;

我希望这有帮助！

Answer 2

您可以尝试使用以下参数添加背景大小 cover - 将背景图像缩放为尽可能大，以使背景区域完全被背景图像覆盖。背景图像的某些部分可能不在背景定位区域中的视野中

或

包含 - 将图像缩放到最大尺寸，使其宽度和高度都适合内容区域

和 percentage - 以父元素的百分比设置背景图像的宽度和高度。第一个值设置宽度，第二个值设置高度。如果只给出一个值，则第二个值设置为“auto”