HTML:如何将网页分为上下两个部分?

1.使用table:

<table>

<tr>

<td height="80%"><jsp:include page="2.jsp"></td>

</tr>

<tr>

<td height="20%"><jsp:include page="3.jsp"></td>

</tr>

</table>

2.使用div+js:

<html>

<head>

<style>body{margin:0;}</style>

<script>

function fixedDiv(){

var d1 = document.getElementById("div1");

var d2 = document.getElementById("div2");

var h = window.document.body.clientHeight;

d1.style.height=h*0.2;

d2.style.height=h*0.8;

}

window.onload=function(){

fixedDiv();

}

window.onresize=function(){

fixedDiv();

}

</script>

</head>

<body>

<div >

<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1

<br>1<br>1<br>1<br>1<br>1<br>1

</div>

</body>

</html>

3.使用div+css:

//index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>

<title>split</title>

<link rel="stylesheet" type="text/css" href="style.css" />

</head>

<body>

<div >

</div>

</body>

</html>

//style.css

* {

margin:0;

padding:0;

}

#top {

background-color:yellow;

width:100%;

height:20%;

overflow:auto;

}

#bottom {

background-color:green;

width:100%;

height:80%;

overflow:auto;

}