div自适应高度
程序员文章站
2022-05-01 08:09:14
...
页面中，有两个div，div分别需要自适应浏览器高度。
代码如下，是使用了css3的自适应属性来实现的.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<style>
html,body{margin:0;padding:0;}
.main{height: 100vh;overflow-y:hidden;}
.content{height: calc(100vh - 55px);}
.action{height:55px;}
</style>
</head>
<body>
<div class="main">
<div id="content" class="content" style="overflow-y: scroll; background: #333; color: #aaa; padding: 10px;">
<div></div>
</div>
<div class="action" style="width:100%;margin-top:5px;" align="center">
<input id="clear" type="button" value="Clear" />
</div>
</div>
</body>
</html>
上一篇： Spring Boot教程十四：基于自定义注解的AOP数据源自动切换
下一篇： DIV高度自适应窗口