Html 为什么我的模态窗口在被触发时会和其他元素一起降低透明度

我一直在做我客户的项目，其中我必须包括一个模态窗口。单击链接时，模型窗口应弹出。 但是当模式窗口被触发时，所有元素的不透明度都会降低，包括模式窗口。 但是默认情况下，模式窗口的不透明度不应该降低，是吗

这是我的模式窗口的HTML代码：

<div id="myModal" class="modal fade" role="dialog" style="background-color: white">
<div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
            <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>

</div>
</div>

&时代；
模态头
模态中的一些文本

接近

这是我的html代码

<div class="col-md-6 col-sm-12">
     <div class="block-image-round margin-top-120">
         <a href="#" data-toggle="modal" data-target="#myModal">
              <img src="images/banners/1.png" style="width:100%; " alt="">
         </a>
     </div>
</div>

模态窗口部分与触发HTML是同级的

当代码段独立运行时

但是当我的项目代码中使用了这里提到的相同片段时

例如，单击此按钮

[1]: https://plnkr.co/edit/aEbvvOWGHGQAoLf2ImiF?p=preview

希望这对您有用

例如，单击此按钮

[1]: https://plnkr.co/edit/aEbvvOWGHGQAoLf2ImiF?p=preview

希望这对您有用

试试这段代码

&时代；
模态头
模态中的一些文本

接近

试试这段代码

&时代；
模态头
模态中的一些文本

接近

我看到了类似的问题。尝试定义

z-index='20000'

：

@Banzay感谢兄弟的回复。但它不起作用。你能提供一个到JSFIDLE代码段的链接吗？我以前也有过这个。将模态放在

标记的末尾，并将

作为它的父项，为我修复了它。在这里，它工作正常。我看到了类似的问题。尝试定义

z-index='20000'

：

@Banzay感谢兄弟的回复。但它不起作用。你能提供一个到JSFIDLE代码段的链接吗？我以前也有过这个。将模态放在

标记的末尾，并将

作为它的父项，为我修复了它。在这里，它可以正常工作。请再次检查我的问题。我已经编辑好了。你能再检查一下我的问题吗。我已经编辑过了。