html - 在表格单元格内分层图像

标签 html css positioning

我想使用 CSS 在表格单元格内将 4 个图像叠加在一起。这是我希望最终图像的样子:

enter image description here

4张图片是:

  1. 灰色圆 Angular 矩形 红色阴影三 Angular 形和 数字
  2. 蓝色条
  3. 条形图顶部的线条
  4. 黄色三 Angular 指示器

所有这些图像必须在表格单元格中彼此重叠。条形必须能够拉伸(stretch)(如果可能的话,我会用具有可变宽度属性的 css div 绘制它)并且三 Angular 形指示器可以移动,所以整个东西不能是一个图像。

有什么办法吗?

注意:任何解决方案都必须在 IE6 及更高版本、Firefox 和 Chrome 中运行

最佳答案

这是你想要做的吗?:How to let an HTML image overlap another

关于html - 在表格单元格内分层图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5184089/

相关文章:

html - 如何使按钮上方的 <Span> 可点击(作为按钮)?

html - Firefox 中格式错误的 div

html - 平均堆栈 : Change body background color on a certain view

jquery - 当内部元素 "leak"它们的边距时,如何获得外部元素的正确高度?

javascript - 单击目标 ="_blank"链接时隐藏 jQueryUI 工具提示

html - 3个DIV彼此相邻,中间填充空白

jquery - 下一个 上一个 jquery 箭头高亮菜单

html - 显示一条细线

html - 响应式 4 部分布局

javascript - 如何将网格添加到选项卡面板