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 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:如何将网页分为上下两个部分的更多相关文章
- 关于网页授权的两种scope的区别说明
关于网页授权的两种scope的区别说明 1.以snsapi_base为scope发起的网页授权,是用来获取进入页面的用户的openid的,并且是静默授权并自动跳转到回调页的.用户感知的就是直接进入了回 ...
- php函数分为哪两种?
PHP的真正威力源自于它的函数.函数分为内置函数和自定义函数. 内置函数 所谓PHP内置函数,就是在php程序的库里面已经定义了的函数,比如echo,mysql_connect,include_onc ...
- 5.把报表集成到Web应用程序中-生成网页和导出两种方式
转自:https://wenku.baidu.com/view/104156f9770bf78a65295462.html 第四部分,把报表集成到Web应用程序中 用MyEclipse新建一个Web ...
- scrapy爬虫提取网页链接的两种方法以及构造HtmlResponse对象的方式
Response对象的几点说明: Response对象用来描述一个HTTP响应,Response只是一个基类,根据相应的不同有如下子类: TextResponse,HtmlResponse,XmlRe ...
- Struts2网页面传值两种方式
第一种方式: /** 列表 */ public String list() throws Exception { List<Role> roleList = roleService.fin ...
- 基于selenium+phantomJS的动态网站全站爬取
由于需要在公司的内网进行神经网络建模试验(https://www.cnblogs.com/NosenLiu/articles/9463886.html),为了更方便的在内网环境下快速的查阅资料,构建深 ...
- Python学习笔记第十五周
目录: 一.CSS补充 1.position 2.overflow 3.hover 4.background 二.JavaScript 三.DOM 主要内容: 一.CSS补充 1.position 可 ...
- 慕课网6-2 作业:js实现轮播特效
小伙伴们,掌握了JavaScript的语法.流程控制语句.内置对象以及DOM和BOM的知识,运用所学知识完成如下图所示的交互效果——轮播图.效果图如下: 具体交互效果图参考gif动态效果图,gif效果 ...
- SPSS把一个数据样本随机分为两部分
SPSS把一个数据样本随机分为两部分 1. 打开SPSS数据文件. 2. 选择DATA>SELECT CASES,打开"Select Cases"对话框 3. 选择&qu ...
随机推荐
- Python面向对象学习
以下面例子作为面向对象基础介绍,类比java里的面向对象既可以,大同小异 class Employee(): raiseAmount=1.04 employeeNum= def __init__(se ...
- zuul隔离机制
文章转载自:https://blog.csdn.net/farsight1/article/details/80078099 ZuulException REJECTED_SEMAPHORE_EXEC ...
- nginx源码分析——数组
ngx_array.h /* * Copyright (C) Igor Sysoev * Copyright (C) Nginx, Inc. */ #ifndef _NGX_ARRAY_H_INCLU ...
- 自建免费的代理ip池
00x01--- 前言 因为爬虫被禁ip这样的反扒真的很凶,但自从建了一个代理ip池以后,反反扒就可以跟的上节奏.当然你也可以上网上各种代理平台自己付费.这些平台当然很方便提供api调用,还不用自己验 ...
- Jetty启动配置解析
目录 1. jetty概述 2. spring-jetty启动配置 1. jetty概述 维基百科:Jetty是一个纯粹的基于Java的网页服务器和Java Servlet容器. Jetty Serv ...
- mysql的root用户被删除, MySQL 服务无法启动 1067错误
本文出现的问题有: 1, root(localhost) 用户被删除; 2, 在关闭mysql服务过后, 无法启动,出现1067错误; 我使用的mysql版本为5.6; mysql的安装路径: C:\ ...
- 解决Couldn't resolve host 'mirrorlist.centos.org
这个错误引起主要是因为环境读取不到yun引起的可以考虑/etc/sysconfig/network-scripts/ifcfg-eth0 配置出错导致网络不通.或者/etc/resolv.conf的D ...
- Java基础知识(数据类型和集合)
一.数据类型 包装类型 包装类型是对基本数据类型不足之处的补充. 基本数据类型的传递方式是值传递,而包装类型是引用传递,同时提供了很多数据类型间转换的方法. Java1.5 以后可以自动装箱和拆箱 二 ...
- 后缀数组(SA)及height数组
最近感觉自己越来越蒟蒻了--后缀数组不会,费用流不会-- 看着别人切一道又一道的题,我真是很无奈啊-- 然后,我花了好长时间,终于弄懂了后缀数组. 后缀数组是什么? 后缀SASASA数组 给你一个字符 ...
- Mybatis框架+原理
https://www.cnblogs.com/luoxn28/p/6417892.html(转载,蛮详细的)