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. Nginx的安装--------tar包安装

    Nginx的安装,在网上搜索是很多的结果,但是 真的安装起来却花费了不少 心思,总结起来就是依赖包安装了,但是没有指定对的路径,在安装的过程中遇到过两个问题: ①make[1]: *** [/usr/ ...

  2. fetchSql是3.2.3新增的连贯操作方法,用于直接返回SQL而不是执行查询。

    fetchSql是3.2.3新增的连贯操作方法,用于直接返回SQL而不是执行查询. 例如: $result = M('User')->fetchSql(true)->find(1); 输出 ...

  3. UITableViewCell delete button 上有其它覆盖层

    第一种解决办法: // Fix for iOS7, when backgroundView comes above "delete" button - (void)willTran ...

  4. Android基础控件ListView基础操作

    1.简介 基于Android基础控件ListView和自定义BaseAdapter适配器情况下,对ListView的数据删除和添加操作: public boolean add(E e) {//添加数据 ...

  5. Docker系列(十三):Kubernetes Service的负载均衡和网络路由的秘密

    Kubernetes Service设计分析 什么是单体程序?所有的模块都在一个进程中 微服务,每一个服务是一个进程的模式 kubernetes中的service其实只是一个概念,是一组相同lable ...

  6. shell 的基本理解

    shell 事先通过一个变量设定好了多个路径,当用户输入命令时,shell会自动到这些路径(由左向右)以此查找 与命令名称相同的可执行文件 hash 用来保存以前曾经执行过的命令,以哈希表的方式保存, ...

  7. MVVM基础概念和理解

    在MVVM模式中,View封装UI和UI逻辑,viewmodel封装presentation逻辑,model封装业务逻辑和数据. View类 View的责任是定义屏幕上的结构和外观,在完美的情况下,v ...

  8. MessageBox用法

    一 函数原型及参数 function MessageBox(hWnd: HWND; Text, Caption: PChar; Type: Word): Integer; hWnd:对话框父窗口句柄, ...

  9. 最大似然估计(Maximum likelihood estimation)

    最大似然估计提供了一种给定观察数据来评估模型参数的方法,即:"模型已定,参数未知".简单而言,假设我们要统计全国人口的身高,首先假设这个身高服从服从正态分布,但是该分布的均值与方差 ...

  10. Mahout In Action-第一章:初识Mahout

    1. 初识Mahout 本章涵盖以下内容: Apache Mahout是什么? 现实中推荐系统引擎.聚类.分类概述 配置mahout 读者可能从本书的标题中猜测到,本书是一本讲解如何将mahout应用 ...