如何使用 z-index -1 在 div 中使表单和按钮可编辑？

Question

我得到了一个设计，它在带有 z-index: -1; 的字段中有一个简单的输入字段

但输入字段不可编辑，按钮没有反应。我认为它与z-index有关。有没有办法让输入字段始终可编辑/焦点并且按钮始终可点击

这是我拥有的页面的一部分，输入字段和按钮位于背景 div 中。 http://www.bootply.com/z5B5YBWS5Y

其他 div 将在输入字段上滚动，但我希望输入字段可编辑且按钮可点击，即使 sillioutte 位于顶部。

Answer 1

z-index:-1 仅在表单上不会导致这种情况。点击事件很可能会点击您输入之上的元素。

如果你不需要用户能够点击它，你可以在 CSS 中设置pointer-events:none 违规元素（在这种情况下，指针事件将传递到表单）。不过，我怀疑最好的解决方案是弄清楚如何将该表单带到页面的表面。