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

最新推荐文章于 2019-08-16 08:51:13 发布

yiyunstone

最新推荐文章于 2019-08-16 08:51:13 发布

阅读量3k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：工作技术文章标签：报表 css border class html list

本文链接：https://blog.youkuaiyun.com/yiyunstone/article/details/4536376

工作同时被 2 个专栏收录

15 篇文章

订阅专栏

技术

3 篇文章

订阅专栏

本文介绍如何通过修改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。