Div 的堆棧相互疊加

Question

第二個 div 堆疊在第一個 div 的頂部，第一個 div 不可見 我怎么能在第一個 div 下面

 .shop { width: 100%; height: 1000px; background-color: #ffffff; position: relative; justify-content: center; display: flex; }.bell { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; position: relative; }

 <div class="shop"></div> <div class="bell"> <img src="bell.png" alt=""> </div>

Answer 1

這是你想要做的嗎？ :)

 .shop { width: 100%; height: 1000px; background-color: #000; justify-content: center; display: flex; }.bell { background-color: red; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } img{ width: 30%; }

 <div class="shop"></div> <div class="bell"> <img src="https://images.pexels.com/photos/1289845/pexels-photo-1289845.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" alt=""> </div>