利用css实现cognos报表表头固定

本文介绍如何通过修改GlobalReportStyles.css文件并添加特定样式类来实现Cognos报表的表头固定,包括list组件和crosstab组件的应用步骤。涉及到的关键样式包括.lockrow(列标题)、.lockcolumn(行标题)和.lockcorner(交叉表角)。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、明白cognos报表控制报表控件的style存放于GlobalReportStyles.css文件中。其中ReportStudio用的存放于D:/Program Files/cognos/c8/webcontent/reportstyles目录下,而HTML页面用到的,存放于D:/Program Files/cognos/c8/webcontent/schemas目录下。

2、修改GlobalReportStyles.css文件,并同时发布到上述两个目录。

在文件末端增加如下style class


div#tbl-container {position:absolute;left:21px;top:70px;width:800px;height:600px;overflow: auto;}/*
高和宽可调*/
.lockrow  /*
列标题样式*/
{
        vertical-align: top;
 background-color: #BFD2E2;      
   border: 1px solid #93B1CD;
 padding: 3px 5px;
        position:relative;
        top: expression(document.getElementById("tbl-container").scrollTop); /*IE5+ only*/
        z-index: 1;

}

.lockcolumn /*行标题样式*/
{
        vertical-align: top;
 background-color: #BFD2E2;      
   border: 1px solid #93B1CD;
 padding: 3px 5px;
        position:relative;
        left: expression(document.getElementById("tbl-container").scrollLeft); /*IE5+ only*/
        z-index: 1;

}

.lockcorner  /*交叉表角样式*/
{
        vertical-align: top;
 background-color: #BFD2E2;      
   border: 1px solid #93B1CD;
 padding: 3px 5px;
        position:relative;
        top: expression(document.getElementById("tbl-container").scrollTop); /*IE5+ only*/
        left: expression(document.getElementById("tbl-container").scrollLeft); /*IE5+ only*/
       z-index: 2;   /*
务必大于列标题样式和行标题样式中的值,表示置于顶层的含义*/

}

 

3、应用于list组件。

在需要的固定表头的list组件上方,插入Html Item。内容为:<div id="tbl-container">

list组件下方,插入Html Item。内容为:</div>

将表头行选中,其属性最底端,class属性值,选择lockrow

4、应用于crosstab组件

在需要的固定表头的crosstab组件上方,插入Html Item。内容为:<div id="tbl-container">

crosstab组件下方,插入Html Item。内容为:</div>

将列标题行选中,其属性最底端,class属性值,选择lockrow

将行标题列选中,其属性最底端,class属性值,选择lockcolumn

将交叉表角选中,其属性最底端,class属性值,选择lockcorner

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值