如何实现左边高度自适应，右边超过某一高度后出现滚动条？
3个回答
展开全部
默认状况下就是高度自适应，设置高度为height:auto；.有滚动条的情况其实也是默认的。设置固定高度之后，添加overflow:auto;应该就可以了吧！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
通过这段前端代码实现：
<div style="height:200px;background:#8D4B01;width:500px;color:#fff;">
<div style="height:200px;background:#8B8C02;width:150px;float:left;">left</div>
<div style="height:200px;width:350px;float:right;overflow-y:scroll;">
<div style="height:500px;">right content</div>
</div>
</div>
<div style="height:200px;background:#8D4B01;width:500px;color:#fff;">
<div style="height:200px;background:#8B8C02;width:150px;float:left;">left</div>
<div style="height:200px;width:350px;float:right;overflow-y:scroll;">
<div style="height:500px;">right content</div>
</div>
</div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
给你段代码吧：
<div style="height:200px;background:#8D4B01;width:500px;color:#fff;">
<div style="height:200px;background:#8B8C02;width:150px;float:left;">left</div>
<div style="height:200px;width:350px;float:right;overflow-y:scroll;">
<div style="height:500px;">right content</div>
</div>
</div>
<div style="height:200px;background:#8D4B01;width:500px;color:#fff;">
<div style="height:200px;background:#8B8C02;width:150px;float:left;">left</div>
<div style="height:200px;width:350px;float:right;overflow-y:scroll;">
<div style="height:500px;">right content</div>
</div>
</div>
追问
非常感谢！但是高度需要为全屏高度，不知能否实现。
追答
全屏的 估计得用JS了 用JS动态设置高度 我目前是这样做的 希望对你有用：
<html>
<head>
<title>js test</title>
<style>
*{margin:0;padding:0}
</style>
</head>
<body>
<div id="outer" style="height:200px;background:#8D4B01;width:500px;color:#fff;">
<div id="left_inner" style="height:200px;background:#8B8C02;width:150px;float:left;">left</div>
<div id="right_inner" style="height:200px;width:350px;float:right;overflow-y:scroll;">
<div style="height:1200px;">right content</div>
</div>
</div>
<script type="text/javascript">
window.onload=function(){
var wrapOuter = document.getElementById("outer");
var wrapInnerLeft = document.getElementById("left_inner");
var wrapInnerRight = document.getElementById("right_inner");
var screenHeight = document.body.clientHeight;
wrapOuter.style.height=screenHeight;
wrapInnerLeft.style.height=screenHeight;
wrapInnerRight.style.height=screenHeight;
}
</script>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
