Question

我的网站右侧有一个“向下”按钮，可以平滑地滚动到下面的折叠区域。但在较小的窗户;上网本，ipads等 - 按钮被推到内容后面。我怎样才能正确设置该图像/ div的z-index，以便在较小的屏幕上显示时它出现在内容上方？

Answer 1

z-index必须高于你想要的DOM对象的z-index。此外，需要将poistion设置为relative（position：relative;）。默认情况下，所有DOM对象的z-index均为0。

Answer 2

z-index越高，div / img在其余部分前面越多。如果您想确保按钮位于其余按钮之前，请使用9999。

Answer 3

其他评论是正确的，您的按钮需要比其他内容具有更高的z-index。以下是一个例子。

<body>
   <style type="text/css>
      .content
      {
         position:relative;
         z-index:1;
      }
      .button
      {
         position:relative;
         z-index:10;
      }
   </style>
   <div class="content">
      Content
   </div>
   <a class="button">
      Button
   </a>
</body>

设置z-index顶部

3 个答案: