html - 页面上的背景图像覆盖文字

背景图像覆盖页面上的文本。任何帮助，将不胜感激。在主页上，我有：

    #bg {
      position: fixed;
      top: 1em;
      right: 30%;
      bottom: 0;
      left: 30%;
      margin: 0 -600px;
      background-size: cover;
    }

<div id="bg">
  <img src="http://placehold.it/600x150" width="100%" height="200%" alt="">
</div>

<h1> Welcome to the home page </h1>

最佳答案

您可以在z-index: -1元素中使用#bg

    #bg {
      position: fixed;
      top: 1em;
      right: 30%;
      bottom: 0;
      left: 30%;
      margin: 0 -600px;
      background-size: cover;
      z-index: -1;
    }

    

<div id="bg">
  <img src="http://placehold.it/600x150" width="100%" height="200%" alt="">
</div>

<h1> Welcome to the home page </h1>

关于html - 页面上的背景图像覆盖文字，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27439158/