Question

我试图让图片覆盖我的帖子，因此文字和图片会在图片后面显示。当我试图让它堆叠在一切上时，z-index不起作用。我不是编码方面的专家，老实说我只是使用tumblr，但我似乎无法在任何地方找到答案。或者我能理解的，因为我还是初学者。任何帮助都将受到超级赞赏，这里是代码：

#char {
    position:fixed; 
    opacity: 1.0; 
    width: 1366px; 
    height: 768px; 
    TOP:0px; 
    LEFT:0px; 
    z-index: 4;
}

Answer 1

我添加了一个代码段，它只包含一个div。 div与身体重叠。如果您提供源代码，我可以澄清一下。你也可以尝试将z-index增加到99或999.我认为你的代码中有很多z index＆＃39; d div。

<html>
    <head>
        <title></title>
    </head>
    <style type="text/css">
        #char {
        position:fixed; 
        opacity: 1.0; 
        width: 1366px; 
        height: 768px; 
        TOP:0px; 
        LEFT:0px; 
        z-index: 4;
        background-color: red;
    }
    body{
        background-color: #ccc;
    }
    </style>
    <body>
    <div id="char">
    </div>
    </body>
    </html>

Answer 2

您还可以尝试将图像作为背景图像添加到元素中，然后将文本放在该元素中的另一个元素中。使用几行对齐代码，您可以将文本放在您想要的位置。

＆＃13;

<style>
.divStyle {
  background-image: url('http://38.media.tumblr.com/a10b40131efc719d0bff421226b9c52b/tumblr_inline_mq5b19gEvv1qz4rgp.jpg');
  background-size: cover;
  height: 90vh; // put this to a 100 to cover the full height of the containing element (less here to avoid scroll bar)
  width: 100%;
  display: flex;
  align-items: center; //change center to 'flex-start' to move text to top or 'flex-end' to move it to the bottom
}

.myText {
  width: 100%;
  color: white;
  font-size: 24px;
  text-align: center; //can also be 'left' or 'right'
}
</style>

<div class="divStyle">
  <div class="myText">Here is my text</div>
</div>

＆＃13;

固定位置z-index不起作用

2 个答案: