问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

我需要将这两个 div 堆叠在一起，同时保持内容位置

社区维基
1
新手上路，请多包涵

我需要将这两个 div 堆叠在一起，但我无法找到实现它的方法。我需要将所有文本保持在相同的位置，但需要能够让 div 位于一个和另一个之上，而不需要为它们设置绝对位置。

这是我所拥有的…

 <body>

<div style="position:relative;">
  <div style="position:absolute">
    <p style="width: 762px; left:193px;" class="large-bold-font">hello hello helloT</p>
    <p id="Customer.Description" style="left: 397px; top: 45px;" class="small-font"></p>
  </div>
</div>

<div style="position:relative;">
  <div style="position:absolute">
    <p style="width: 762px; left:193px;" class="large-bold-font">hello hello helloT</p>
    <p id="Customer.Description" style="left: 397px; top: 45px;" class="small-font"></p>
  </div>
</div>

</body>

原文由 user3233834 发布，翻译遵循 CC BY-SA 4.0 许可协议

Stack Overflow 翻译csshtmlstackstacked
阅读 230
1 个回答
得票最新
社区维基
1

您应该将两个 div 的内容放在具有“position:relative”的外部 div 中，并将绝对定位放在内部 div 上，并为每个 div 添加一个 z-index。然后将较大的 z-index 放在较小的 z-index 之上。

 <body>
   <div style="position:relative;">
      <div style="position:absolute;z-index:0;">
         <p style="width: 762px; left:193px;" class="large-bold-font">hello hello helloT</p>
         <p id="Customer.Description" style="left: 397px; top: 45px;" class="small-font"></p>
      </div>

      <div style="position:absolute;z-index:1;">
         <p style="width: 762px; left:193px;" class="large-bold-font">hello hello helloT</p>
         <p id="Customer.Description" style="left: 397px; top: 45px;" class="small-font"></p>
      </div>
   </div>
</body>

原文由 Peter 发布，翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录，登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进，让解决方法与时俱进
推荐问题