下面这段代码，x1_left的高度100%总是相对于浏览器的高度而不是相对于其父元素的高度？如何让它相对于父元素的高度为100%?
1
548<html>
<style>
*{margin:0;padding:0;border:0;}
.x1{width:100%;background:grey;}
.taskbar{width:100%;height:30px;background:yellow;}
.x1_left{width:100px;height:100%;background:red}
</style>
<body>
<p id="x1" class="x1">
<p id="x1_left" class="x1_left">
</p>
<p id="x1_right" class="x1_right">
</p>
</p>
<p id="taskbar" class="taskbar"></p>
</body>
<script>
var scroll_height = document.body.scrollHeight;
var ct_x1 = document.getElementById('x1');
var ct_x1_left = document.getElementById('x1_left');
ct_x1.style.height = scroll_height-30;
ct_x1_left.style.height = '100%';
</script>
</html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
你给x1一个高度吧，height:100%;是相对于父节点的，你没有给父节点的高度所以父节点撑开到100%满屏了