<div class="test test-1"> <div class="inner"> <div class="child"> Child </div> </div> </div> <div class="test test-2"> </div>
.test { width: 100px; height: 100px; } .test-1 { position: relative; background: #f20; } .inner { width: 80px; height: 80px; transform: scale(1); /*此处会产生新的stacking context*/ background: green; } .child { position: absolute; bottom: 15px; color: #fff; font-size: 30px; z-index: 1000; } .test-2 { position: relative; margin-top: -50px; background: #000; }