四层效果叠加的实现问题,有图,诚恳求教

[再看我一眼]

现在需要实现这样一个页面



两侧锁链是压在每一个这样的区域的标题区域下边

灯光效果是压在文字内容之上的

目前我的做法是

把页面区域作为最底层使用通用的背景图案

把铁链作为第二层

把标题和内容区域作为第三层

把灯光作为第四层

代码的写法是 二三四层都使用固定的高度 同级div 然后position:relative top:-xxpx 这样子使其叠加

但是页面现在是三倍的高度 很不好看

先请问第一个问题,现在的这种做法下 能否解决三倍高度的问题

再请教下 更好的做法是什么

谢谢

[再看我一眼]

其实把这整个区域作为背景 是最方便的 但是这样的每个区域 高低是不同的 如果都用整个区域的图片作为背景 那页面感觉会太重

[再看我一眼]

多层还有另外一个问题 就是文字层的链接啊什么的都点不到了 总感觉自己越走越偏了

[再看我一眼]

来个人拿分 谢谢 项目已完成 用了五层叠加