css - 定位一个 div(存在于 jsp 文件的底部)以显示在所有其他 div 之上

Question

我有一个类似这样的页面

<div id="top">
</div>
<div id="bottom">
</div>

我想要一个先显示底部然后显示顶部的输出.. 我如何使用 CSS 实现此目的？？

Answer 1

如果您的问题意味着以下内容......“您可能希望将 div#bottom 放置在下方其他绘制的 DOM 元素之上”。 DOM 排序。

如果你想让#top和#bottom成为独立的DOM元素。

div#top {
  width:200px;
  height:100px;
  background-color:red;
}

div#bottom {
  position:absolute;
  width:100px;
  height:50px;
  background-color:blue;
  top:10%;
  left:4%;
}

• 顶部和左侧的值是您选择的值，上面的示例将底部放在顶部内。

• 定位 - 可用于操作相同的对象。您可以在一个巨大的包含 div 中使用固定元素。但仅当您确定即使在溢出时也将显示 DOM 内容时，才使用 fixed 。当您正在工作时，“相对”定位也可能起作用引用是主体或根节点类或元素。

如果你想控制DOM如何显示这些元素。那么你可能必须使用 JavaScript 和 CSS 来实现这一点。喜欢说

document.getElementById('bottom').style.display = 'block';
document.getElementById('top').style.display = 'none'; 

超时后 设置超时(功能(){ document.getElementById('top').style.display = 'block'; }, 200);

因为独立的 div 不是最好的方法，所以我建议你试试这样的方法

<div id="top_div">
   <div id="bottom_div">
   </div>
</div>