如何将背景图片放在页面内容后面?

use*_*688 0 html css

我的网页上有一张背景图片。现在我想添加漂浮在它上面的内容。下面的代码将内容放在图像后面。如何纠正?

请注意,我已经借用(并且我正在尝试获得效果)在此链接中讨论的背景图像: CSS-Only Technique #2来自:http : //css-tricks.com/perfect-full-page-background-image/

<!DOCTYPE html>
<html>
<head>  
    <style type="text/css">
    <!--
    #bg {
            position: fixed; 
            top: -50%; 
            left: -50%; 
            width: 200%; 
            height: 200%;
          }
          #bg img {
            position: absolute; 
            top: 0; 
            left: 0; 
            right: 0; 
            bottom: 0; 
            margin: auto; 
            min-width: 50%;
            min-height: 50%;
          }
     -->
     </style>      
</head> 
<body>

    <div id="bg">
        <img src="myimage.jpg">
    </div>

    <div id="mycontent">
        ...
    </div>
 </body>
 </html>
Run Code Online (Sandbox Code Playgroud)

jle*_*gio 6

只需将您z-index的值设置为负值

#bg{
    z-index:-1;
}
Run Code Online (Sandbox Code Playgroud)