如何固定表格的标题行和标题列
来源:中国站长学院 发布时间:2007-09-20 13:03:00
标签:表格,标题
网上有许关于固定表格的标题行的文章,但是既要固定标题行又要固定标题列的却几乎没有。现我写下如下代码以供大家参考:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<script>
function syncscroll(obj)
{
y.innerHTML = obj.scrollTop;
x.innerHTML = obj.scrollLeft;
scroll1.children[0].style.position = "relative";
scroll2.children[0].style.position = "relative";
scroll1.children[0].style.left = "-"+obj.scrollLeft;
scroll2.children[0].style.top = "-"+obj.scrollTop;
}
</script>
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<!--*****************************************************左上-BEGIN*****************************************************-->
<table width="240" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="80" >
<col width="80" >
<col width="80" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
</table>
<!--*****************************************************左上-END*****************************************************-->
</td>
<td>
<div id=’scroll1’ style="width:450;overflow:hidden ">
<!--*****************************************************右上-BEGIN*****************************************************-->
<table style="width:900 " height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td> </td>
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<!--*****************************************************右上-END*****************************************************-->
</div>
</td>
</tr>
<tr>
<td align="left" valign="top">
<div id=’scroll2’ style="height:150;overflow-y:hidden;overflow-x:scroll">
<!--*****************************************************左下-BEGIN*****************************************************-->
<table width="240" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="80" >
<col width="80" >
<col width="80" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
</table>
<!--*****************************************************左下-END*****************************************************-->
</div>
</td>
<td align="left" valign="top">
<div style="width:450;height:150;overflow:scroll " onscroll="javascript:syncscroll(this)">
<!--*****************************************************右下-BEGIN*****************************************************-->
<table style="width:900 " height="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td width="100" height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<!--*****************************************************右下-END*****************************************************-->
</div>
</td>
</tr>
</table>
<p id="y"> </p>
<p id="x"> </p>
</body>
</html>
0
投稿
猜你喜欢
- 1.先停止mysqld.exe的进程2.打开cmd进入到你mysql的bin目录下输入此命令:mysqld --skip-grant-tab
- 通过观察执行计划,发现之前的执行计划在很多大表连接的部分使用了Hash Join,由于涉及的表中数据众多,因此查询优化器选择使用并行执行,速
- cookielib是一个自动处理cookies的模块,如果我们在使用爬虫等技术的时候需要保存cookie,那么cookielib会让你事半功
- 1、Xmind用例编写规范1:需求大模块2:大模块中的小模块(需要根据需求来看需要多少层)3:用例等级和用例名称用例等级(转换成Excel文
- 本文实例讲述了mysql索引对排序的影响。分享给大家供大家参考,具体如下:索引不仅能提高查询速度,还可以添加排序速度,如果order by
- 权限及设计数据库用户管理使用SQLyog 创建用户,并授予权限演示基本命令/* 用户和权限管理 */ ------------------用
- 前面介绍了python在ubuntu16.04环境下,python的虚拟环境virtualenv的安装,下面介绍在windows环境下的安装
- 数据迁移需要从mysql导入clickhouse, 总结方案如下,包括clickhouse自身支持的三种方式,第三方工具两种。create
- 最近,随着数据库的日益庞大,本来两个差不多的数据库,我开始发现我的数据库查询起来越来越比我朋友网站的慢了,经过初步对照,问题好像出在访问记录
- 用MSI安装包安装根据自己的操作系统下载对应的32位或64位安装包。按如下步骤操作:MySQL数据库官网的下载地址http://dev.my
- 本文实例讲述了Python实现的重启关机程序的方法,对Python程序设计有一定的参考价值。具体方法如下:实例代码如下:#!/usr/bin
- 前言很多人会使用postman工具,或者熟悉python,但不一定会使用python来编写测试用例脚本,postman里面可以完整的将pyt
- 项目中经常会遇到这样的问题:当某个 js 脚本加载完成后再执行相应任务,但很多朋友可能并不知道怎么判断我们要加载的 js 文件是否加载完成,
- --1、为数据库启用SQL Server全文索引EXEC sp_fulltext_database 'enable'--2、
- 先来看段mysql查询文章回复语句:#查询文章回复-- ------------------------------ Procedure s
- 有如下实现方法: 在Firefox, Google Chrome, Safari, Opera中:可以用 window.getSelecti
- 本文实例讲述了python使用PyGame模块播放声音的方法。分享给大家供大家参考。具体实现方法如下:import pygamepygame
- Python 中常用的数据类型包括:数字类型:包括整型(int)、长整型(long)、浮点型(float)、复数型(comple
- 从初学 django 到现在(记得那时最新版本是 1.8,本文发布时已经发展到 3.1 了),开发环境一直都是使用从官方文档或者别的教程中学
- 于是就测试了下: var stringToDom=function(text) { var doc; if(window.ActiveXOb