如何从弹出窗口中删除背景控件？

Question

我正在开发Angular 2中的Web应用程序。点击按钮我试图打开弹出窗口。我能用JavaScript做到这一点。我现在正在Angular 2中尝试。

下面是我在主页内弹出的HTML代码。

 <button id="myBtn">Open Modal</button>

    <!-- The Modal -->
    <div id="myModal" class="modal">

        <!-- Modal content -->
        <div class="modal-content">
            <span class="close">&times;</span>
            <p>Some text in the Modal..</p>
        </div>

  </div>

在主页面中，我有一个文本框。当我打开弹出窗口弹出文本框时，也会显示如下。

过滤记录文本框位于html页面，而不是弹出窗口。有人可以帮我解决这个问题吗？谢谢。

Answer 1

听起来你已经将高z-index应用于过滤器记录文本框和按钮; z-index是一种样式属性，允许您通过降低“过滤器记录”文本框/按钮上的z-index来指定哪些内容出现在其他内容之前。

点击此处z-index了解详情：https://www.w3schools.com/cssref/pr_pos_z-index.asp