CSS 控制table 滑动及调整列宽等问题总结
一. 通过css控制table y方向上滚动
max-height: 200px;
/* 宽度大概比表头宽17px,具体值实际调试 */
width:531px;
overflow-y: scroll;
}
二.通过css控制table x,y方向上滚动
width:500px;
overflow:hidden;
}
width:517px;
overflow:scroll;
max-height:200px;
}
var $top=document.getElementById("top-div");
var $right=document.getElementById("right-div");
function scroll(){
$top.scrollLeft = $right.scrollLeft
}
$right.onscroll=scroll;
</script>
三. 表格宽度
1. 分析下table-layout:
2.分析下colspan
3.解决方案
1)去掉table-layout:fixed-out属性
2)使用colgroup提前确定好列宽。
<col class="techDepartment"></col>
<col class="marketDepartment"></col>
<col class="financeDeparment"></col>
<col class="name"></col>
<col class="age"></col>
<col class="from"></col>
<col class="level"></col>
</colgroup>
CSS 控制table 滑动及调整列宽等问题总结的更多相关文章
- JQuery 表格拖动调整列宽效果
类似于桌面程序中的表格拖动表头的效果,当鼠标停留在表头边框线上时,鼠标会变成表示左右拖动的形状,接着拖动鼠标,会在表格中出现一条随鼠标移动的竖线,最后放开鼠标,表格列宽会被调整.最近比较空闲,便自己动 ...
- 【Qt开发】QTableWidget设置根据内容调整列宽和行高
QTableWidget要调整表格行宽主要涉及以下一个函数 1.resizeColumnsToContents(); 根据内容调整列宽 ...
- [办公应用]我的WORD文档表格操作不灵活 无法调整列宽
最近同事的一个word文档中的表格操作非常不灵活,用鼠标直接调整列宽时总觉得很不灵活.她的操作系统为XP,office 为微软office 2003. 我首先检查了木马,检查了输入法等,结果都没有问题 ...
- MS WORD 表格自己主动调整列宽,自己主动变美丽,依据内容自己主动调整
在MS WORD中,当有大量的表格出现时,调整每一个表格的的高和宽和大小将是一件很累的事情,拖来拖去,很耗时间,并且当WORD文档达到300页以上时,调整反应很的慢,每次拖拉线后,须要等待一段时间其才 ...
- Java使用POI为Excel打水印,调整列宽并设置Excel只读(用户不可编辑)
本文介绍在Java语言环境下,使用POI为Excel打水印的解决方案,具体的代码编写以及相关的注意事项. 需求描述: 要求通过系统下载的Excel都带上公司的水印,列宽调整为合适的宽度,并且设置为不可 ...
- C# dataGridView根据数据调整列宽
//自适应列宽 this.dgvBaoming.AutoSizeColumnsMode = System.Windows.Forms.DataGridViewAutoSizeColumnsMode.A ...
- 完美实现保存和加载easyui datagrid自定义调整列宽位置隐藏属性功能
需求&场景 例表查询是业务系统中使用最多也是最基础功能,但也是调整最平凡,不同的用户对数据的要求也不一样,所以在系统正式使用后,做为开发恨不得坐在业务边上,根据他们的要求进行调整,需要调整最多 ...
- css控制table的td宽度
今天发现即使设置table的td.th宽度,仍是不管用,是根据table的td的内容来适应宽度,导致其他的th.td丢失. 下图就是浏览器渲染的table,导致缺失"端口"这一列, ...
- 使用css控制table的cellspacing和cellpadding属性
HTML默认的表格样式之间有间隙,每次为了解决这些问题,总要在table标签里添加cellspacing和cellpadding,你是否也很厌倦这样的写法, 那么有没有对应的CSS属性能达到相同的效果 ...
随机推荐
- gulp填坑记(一)
gulp是基于Node.js的自动任务运行器.可以自动完成html.image.css和js等文件的检测.检查.合并.压缩.格式化等,并监听文件在改动后重复指定的这些步骤. 一.首先,我全局安装了gu ...
- mongo数据删除和游标
数据删除 db.集合.remove(删除条件,是否只删除一个数据);默认删多条(false)true删除一条db.集合.remove({}) 删除所有元素但集合还在db.集合.drop() 删除集合 ...
- Spring-cloud (七)自定义HystrixCommand
前提 1.在继续学习Hystrix之前,向关注本人博客的各位致歉 由于之前的项目起名以及服务之间的名称不是很规范,所以我修改了这些名称方便后来的代码管理,这些代码可以在本人github中找到,这里贴出 ...
- 使用translate将字符串中的数字提取出来
--方法1: with tmp as ( select '按时的撒旦123元(其中含存款11元)' name from dual union all select '一类似的预存9600元(新势力)' ...
- OLE:对象的类没有在注册数据库中注册
我在网上下载了破解版的SAS9.3,用了一段时间之后,今天打开就填出一个提示框:OLE:对象的类没有在注册数据库中注册 激活该对象所需的应用程序不可用.是否用"转换--"将其转换为 ...
- 深入理解Oracle中的随机函数
--Oracle中取随机值的函数 .dbms_random包 dbms_random包提供了一系列的随机值获取函数以及相关存储过程.下面详细讲解常用的函数和过程. ()dbms_random.rand ...
- merge into的用法及10g新特性总结
merge into 的作用: 将源数据(来源于实际的表,视图,子查询)更新或插入到指定的表中(必须实际存在),依赖于on条件,好处是避免了多个insert 和update操作. merge是一个目标 ...
- ACM Doing Homework again
Ignatius刚刚从第30届ACM / ICPC回到学校.现在他有很多作业要做.每个老师给他一个截止作业的截止日期.如果Ignatius在截止日期之后进行了家庭作业,老师将减少他的最终考试成绩.现在 ...
- How to Change Default Web ADI Upload Parameters for FlexField Import / Validation
How to Change Default Web ADI Upload Parameters for FlexField Import / Validation (文档 ID 553345.1) 转 ...
- 【Java集合系列】---总体框架
个的组合,这些数据项可能共享某些特征,需要以某种操作方式一起进行操作,一般来说,这些数据项的类型都是相同的,或者基类相同(若使用的语言支持继承),列表或数组通常不认为是集合,因为其大小固定,但是事实上 ...