css - 将 HTML“粘合”到图像上

Question

这是我的困境，我有一个背景图像，上面有一个栏。我通过使用适合背景图像

body {
     background-image: url("foo");
     background-size: 100%;
}

我也有一些我想在那个栏内的 html。问题是，当用户调整浏览器窗口的大小时，图像会调整以适应它（这是我想要它做的）但 html 保持在同一个位置，所以它被放在栏之外。有没有办法让我的 html 像图像一样调整大小，以便 html 看起来粘在图像上？有人可以给我一个css剪辑吗？

score 0 · Accepted Answer

如果您希望栏可调整大小，请将其高度和宽度设置为容器高度和宽度的百分比量。当然，当窗口缩小到很大程度时，HTML 就会溢出，这是没有办法的。

score 0 · Accepted Answer

使用图像来指导布局的最大问题就是这个问题。不幸的是，哈里森，你没有解决方案可以让你在不改变图像的情况下跨浏览器或浏览器大小做你想做的事。如果可以的话，请张贴应该是什么样子的屏幕截图，以便我们可以帮助您修改背景以提高其兼容性

同时，我建议您从图像中删除条形并继续使用图像作为背景。然后使用 divdisplay: block;并使用 bar 作为其背景。

2 回答 2