css - "Gluing"HTML 到图像

标签 css

这是我的难题,我有一张背景图片,上面有一个栏。我使用

适合背景图像
body {
     background-image: url("foo");
     background-size: 100%;
}

我也有一些 html,我想放在 inside 那个栏中。问题是,当用户调整浏览器窗口大小时,图像会调整以适合它(这是我想要它做的)但是 html 停留在同一个位置,所以它被放在栏外。有没有一种方法可以使我的 html 像图像一样可调整大小,从而使 html 看起来粘附到图像?有人可以为此给我一个 css 剪辑吗?

最佳答案

使用图像指导布局的最大问题就是这个问题。不幸的是,Harrison,没有任何解决方案可以让你在不更改图像的情况下跨浏览器或浏览器大小做你想做的事。如果可以,请发一张它应该是什么样子的截图,以便我们可以帮助您修改背景以提高其兼容性

与此同时,我建议您从图片中删除条形并继续使用图片作为背景。然后使用带有 display: block; 的 div 并将条形图用作其背景。

关于css - "Gluing"HTML 到图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11704527/

相关文章:

html - 忽略父级的侧边距但尊重垂直滚动条来填充 100% 的视口(viewport)

css - 如何在 Aurelia 中动态更改元素主题

javascript - 如何使用 CSS3/HTML5 创建一个切片圆?

css - 将 rems 与像素后备一起使用

css - 使用转换查询时 h1 跨度不旋转

css - 有没有办法在CSS2中表达CSS3的否定伪类?

CSS webkit-scrollbar 和 safari

html - DIV 的 "position"属性的默认值是多少?

html - 平行四边形文本框

javascript - 包括 php 菜单,将事件类分配给单击的链接