html之左边不动右边内容自动修剪并出现滚动轮查看剩余内容

时间:2023-03-09 16:51:10
html之左边不动右边内容自动修剪并出现滚动轮查看剩余内容
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body{
margin:0;
}
</style>
</head>
<body>
<div style="height: 30px;background-color: #4ccdea"> </div>
<div>
<div style="float: left;position: absolute;left: 0;top: 30px;bottom: 0; background-color: #168258;width: 200px;">
a
</div> <div style="background-color: #dd84b0; position: absolute;right: 0;bottom: 0;left:200px;top:30px; float: left;overflow: auto">
<!--<div style="overflow: auto">-->
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<p>adssdsd</p>
<!--</div>-->
</div> </div>
</body>
</html>