如何在div后面放置背景图片

Wolfiebae

我试图将我的背景放在包含巨无霸的div后面，但div始终保持在背景图像下方，而不是出现在背景图像上。我该如何解决？

PS：出于某些原因，我不想将背景图像放在CSS文件中，因此我希望图像src仅在HTML中。非常感谢！

这是我的代码：

        <div class="container-fluid" >
         <img src='U_Thant_PIC_3.jpg'
            width='1400px' height='800px'/>

            <div class="jumbotron jumbotron-fluid">
                <center>
                    <h2 class="a">Cats are cool</h2>
                </center>

            </div>
</div>

大卫

为了实现这一点，您需要告诉浏览器将img元素放置在孩子的后面div。为此，您可以使用具有的的position属性。imgz-index

在z-index这个没有工作，只要你有position对元素的属性：

div.container-fluid{position:relative;}
div.container-fluid img{position:absolute;top:0;left:0;z-index:1}
div.container-fluid div.jumbotron{position:relative;z-index:5;color:white;}

<div class="container-fluid" >
         <img src='https://www.w3schools.com/css/img_lights.jpg'
            width='1400px' height='800px'/>

            <div class="jumbotron jumbotron-fluid">
                <center>
                    <h2 class="a">Cats are cool</h2>
                </center>

            </div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。