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 id="div1" style="width:100%;overflow-y:auto;">
      <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>
<div id="div2" style="width:100%;overflow-y:auto;">
      <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 id="top"></div>
<div id="bottom">

</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;
}

HTML：如何将网页分为上下两个部分的更多相关文章

  1. 关于网页授权的两种scope的区别说明

    关于网页授权的两种scope的区别说明 1.以snsapi_base为scope发起的网页授权,是用来获取进入页面的用户的openid的,并且是静默授权并自动跳转到回调页的.用户感知的就是直接进入了回 ...

  2. php函数分为哪两种？

    PHP的真正威力源自于它的函数.函数分为内置函数和自定义函数. 内置函数 所谓PHP内置函数,就是在php程序的库里面已经定义了的函数,比如echo,mysql_connect,include_onc ...

  3. 5.把报表集成到Web应用程序中-生成网页和导出两种方式

    转自:https://wenku.baidu.com/view/104156f9770bf78a65295462.html 第四部分,把报表集成到Web应用程序中 用MyEclipse新建一个Web ...

  4. scrapy爬虫提取网页链接的两种方法以及构造HtmlResponse对象的方式

    Response对象的几点说明: Response对象用来描述一个HTTP响应,Response只是一个基类,根据相应的不同有如下子类: TextResponse,HtmlResponse,XmlRe ...

  5. Struts2网页面传值两种方式

    第一种方式: /** 列表 */ public String list() throws Exception { List<Role> roleList = roleService.fin ...

  6. 基于selenium+phantomJS的动态网站全站爬取

    由于需要在公司的内网进行神经网络建模试验(https://www.cnblogs.com/NosenLiu/articles/9463886.html),为了更方便的在内网环境下快速的查阅资料,构建深 ...

  7. Python学习笔记第十五周

    目录: 一.CSS补充 1.position 2.overflow 3.hover 4.background 二.JavaScript 三.DOM 主要内容: 一.CSS补充 1.position 可 ...

  8. 慕课网6-2 作业：js实现轮播特效

    小伙伴们,掌握了JavaScript的语法.流程控制语句.内置对象以及DOM和BOM的知识,运用所学知识完成如下图所示的交互效果——轮播图.效果图如下: 具体交互效果图参考gif动态效果图,gif效果 ...

  9. SPSS把一个数据样本随机分为两部分

    SPSS把一个数据样本随机分为两部分 1.  打开SPSS数据文件. 2.  选择DATA>SELECT CASES,打开"Select Cases"对话框 3. 选择&qu ...

随机推荐

  1. 【JZOJ3317】管道

    description Hotham市再次被Jester袭击.这一次,Jester攻击的目标是Hotham的供水系统.Hotham的淡水存储在N个水库,由M个管道连接. 任意2个水库之间至少有一条路径 ...

  2. VS2010版的Speex音频处理模块(附源码+测试demo)

    开源的Speex代码内部包含了VS2003,05,08工程,但是直接编译总有一些要设置的地方,虽说也不是很复杂,但是对于不是很了解VS的同学来说还是要折腾一阵,所以我弄了一个可以直接使用的版本,当然是 ...

  3. 莫烦pytorch学习笔记(二)——variable

    .简介 torch.autograd.Variable是Autograd的核心类,它封装了Tensor,并整合了反向传播的相关实现 Variable和tensor的区别和联系 Variable是篮子, ...

  4. 47 Majority Element II

    原题网址; https://www.lintcode.com/problem/majority-element-ii/ 描述 给定一个整型数组,找到主元素,它在数组中的出现次数严格大于数组元素个数的三 ...

  5. Spring注解驱动(上)

    记录常用的spring注解 1.@Configuration 和 @Bean spring中可以使用xml 的方式进行配置, 也可以使用 @ Configuration 来指定一个类为配置类, 并使用 ...

  6. JS和JQuery概括

    1. BOM 1. location相关 1. location.href 2. location.href="http://www.sogo.com" 3. location.r ...

  7. selenium 三种断言以及异常类型

    selenium 提供了三种模式的断言:assert .verify.waitfor Assert 失败时,该测试将终止. Verify 失败时,该测试将继续执行,并将错误记入日显示屏 .也就是说允许 ...

  8. 在HBase之上构建SQL引擎

  9. Lp- Linux必学的60个命令

    1.作用 lp是打印文件的命令,使用权限是所有用户. 2.格式 lp [-c][-d][-m][-number][-title][-p] 3.主要参数 -c:先拷贝文件再打印. -d:打印队列文件. ...

  10. Apache 禁用IP 访问 和 HTTP 跳转 HTTPS

    如果需要 禁用IP 访问并且 需要 HTTP 跳转到 HTTPS <VirtualHost *:80> ServerName xxx.xxx.com RewriteEngine On Re ...