CSS: 如何避免 overflow: hidden 隐藏子元素

如果你不想被父级和爷爷级的 'overflow: hidden' 属性隐藏，可以使用 'position: absolute' 来脱离文档流，并设置 'z-index' 属性来保持在父级和爷爷级之上。

HTML 结构：

<div class="grandfather">
  <div class="father">
    <div class="child">Content</div>
  </div>
</div>

CSS 样式：

.grandfather {
  position: relative;
  overflow: hidden;
}

.father {
  position: relative;
}

.child {
  position: absolute;
  z-index: 1;
}

在上面的例子中，'.child' 元素使用了 'position: absolute' 来脱离文档流，并设置了 'z-index: 1'，确保它在父级和爷爷级之上显示。这样即使父级和爷爷级设置了 'overflow: hidden'，'.child' 元素仍然可见。