overflow 的裁剪与定位元素（position）使用

overflow 要对postion: absolute 的元素起到超出裁剪作用

  1. 可将overflow 的元素也变成定位元素：position: absolute/relative或
  2. 给定位元素：position: absolute/relative 添加一个定位元素 作为其父元素

使用了position 的为定位元素

// 不起作用
<div style="overflow: hidden;">
    <div style="position:absolute;"><div>
</div>

// 起作用1
<div style="overflow: hidden;position:relative;">
    <div style="position:absolute;"><div>
</div>

// 起作用2
<div style="overflow: hidden;">
    <div style="position:relative;">
        <div style="position:absolute;"><div>
    </div>
</div>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容