怎样设置div高度全屏?

发布网友发布时间：2022-05-10 19:46

共4个回答

热心网友时间：2022-04-27 05:44

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>test</title>
<style type="text/css">
*{margin:0px;padding:0px;}
.header {
width: 100%;
background: #567;
height: 100px;
}
#col1, #col2, #col3 {
float: left;
width: 80px;
background: #DDD;
margin-right: 10px;
word-wrap:break-word;
font-size:12px;
}
#foot{height:100px; background-color:#ccc;clear:both;}
#middle{ zoom:1;}
</style>
</head>
<body>
<div class="header" id="XX">header</div>
<div id="middle">
   <div id="col1">col1</div>
   <div id="col2">col2</div>
   <div id="col3">col3</div>
</div>
<div id="foot"></div>
<script>
total = document.documentElement.clientHeight;
colHeight = total-100-document.getElementById("col1").offsetTop;
document.getElementById("col1").style.height=colHeight+"px";
document.getElementById("col2").style.height=colHeight+"px";
document.getElementById("col3").style.height=colHeight+"px";
</script>
</body>
</html>

热心网友时间：2022-04-27 07:02

height:100%

热心网友时间：2022-04-27 08:37

热心网友时间：2022-04-27 10:28

直接写height有的浏览器未必支持，还是写样式吧