极客观点
项目管理
HarmonyOS
<div style="height: 300px;width: 100px;position: relative;border: solid;overflow-y: scroll;">
<div style="height: 500px;background-color: lightgrey;"></div>
<div style="width: 100%;height: 100px;background-color: lightgreen;position: absolute;top: 0;"></div>
</div>父组件由于可以滚动，所以他的实际高度不是300，而是500，子组件相对于父组件top:0固定，固定到了实际高度的top:0，我希望是按他实际高度固定，如何实现？
换个思路
<!DOCTYPE html>
<html>
<head>
<style>
.box{
height: 300px;
border: 1px solid #ccc;
overflow: hidden;
}
.content{
height: calc(300px - 30px); /*box高度-title高度*/
background: #f5f5f5;
overflow: auto;
}
.title{
background: #ccc;
height: 30px;
}
</style>
</head>
<body>
<div class="box">
<div class="title">title</div>
<div class="content">
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
<p>content</p>
</div>
</div>
</body>
10 回答11.7k 阅读
2 回答3.2k 阅读✓ 已解决
5 回答2.2k 阅读
4 回答2.2k 阅读✓ 已解决
3 回答1.2k 阅读✓ 已解决
3 回答877 阅读✓ 已解决
3 回答2.6k 阅读
如果你想简单点，那直接父元素加一个啥也不干的transform属性：
然后absolute改为fixed，因为transform元素可以关住fixed元素让fixed相对自身定位而不是根元素。
或者让absolute升一级，成为当前父元素的兄弟元素，而它们共同的父元素使用relative。