固定table表头-创新互联
项目中设计的报表table设计的列数相对过多,当拖动下方的滚动条时无法对应表头所对应的列,因此在网上搜索了好一段日子,最后在网上找到了一些参考资料,然后总结归纳出兼容行列合并的固定表头demo。
多浏览器没有做太多测试,但是在ie9、火狐、360浏览器中已测试通过。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
.div1All{
position: absolute;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px
}
.divHeaderID{
margin-right: auto;
margin-left: auto;
overflow: hidden;
bgcolor: blue;
}
.divContentID{
position: absolute;
left: 0px;
top: 30.5px;
bottom: 0px;
right: 0px;
overflow: scroll
}
Header A | Header B | Header C | Header D | Header E | Header F |
---|
${index.index} | B | C | D | E | F |
创新互联www.cdcxhl.cn,专业提供香港、美国云服务器,动态BGP最优骨干路由自动选择,持续稳定高效的网络助力业务部署。公司持有工信部办法的idc、isp许可证, 机房独有T级流量清洗系统配攻击溯源,准确进行流量调度,确保服务器高可用性。佳节活动现已开启,新人活动云服务器买多久送多久。
网站栏目:固定table表头-创新互联
文章链接:http://scyanting.com/article/ccepog.html