1

我一直在搞乱 z-index 和 position 属性,试图实现下面的 div 框设置。我应该使用什么位置,包括移动设备在内的所有设备可读的最大 z-index 应该是 99 对吗?我的 z-index 似乎很遥远。

<div style="width: 990px; border: 1px solid;">
  <div style="z-index: 1; border: 1px solid; background: #000; position:absolute;">
    Top div 1
  </div>
  <div style="z-index: -2; border: 1px solid; background: #000; position:absolute;">
    back div 2
  </div>
  <div style="z-index: -1; border: 1px solid; background: #000; position:absolute;">
    back div 3
  </div>
  <div style="z-index: 2; border: 1px solid; background: #000; position:absolute;">
    text div 4
  </div>
  <div style="z-index: 3; border: 1px solid; background: #000; position:absolute;">
    Top div 5
  </div>
  <div style="z-index: -1; border: 1px solid; background: #000; position:absolute;">
    Top div 6
  </div>
</div>

在此处输入图像描述

4

1 回答 1

1

最后面的和 textdiv 可以是浮动 div,toleftleft分别right只调整它们的边距。

应该在其他(顶部,背部和顶部)之上的那些可以被包裹在一个position:absolutediv 中并且全部position:relative用于它。再次,应该发挥他们的利润并设置一个高点z-indexz-index:1000向您保证他们应该处于领先地位。

这种方式比试图单独处理它们更简单。

希望这可以帮助。干杯

于 2013-08-17T16:55:40.723 回答