两种方法
方法1
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>等高等宽</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
<script>
function count(){
var w=window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var h=window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
document.getElementById("box").style.width=w+"px";
document.getElementById("box").style.height=h+"px";
};
</script>
</head>
<style type="text/css">
*{
margin:0;
padding:0;
}
#box{
background:block;
}
</style>
<body οnlοad="count()">
<div id="box">等高等宽</div>
</body>
</html>
方法2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>等宽等高 </TITLE>
</HEAD>
<body style="margin:0;">
<div id="mydiv" style="border:1 solid black; background-color:red" ></div>
</body>
<script type="text/javascript">
var mydiv=document.getElementById("mydiv");
var mydiv_resize=function(){
mydiv.style.width=document.body.clientWidth;
mydiv.style.height=document.body.clientHeight;
}
mydiv_resize();
window.οnresize=mydiv_resize;
</script>
</HTML>
复制过去即可使用