润乾报表样式的CSS控制

本文介绍了如何使用CSS控制润乾报表的样式,包括通过添加到样式列表实现单元格样式复用,以及在报表发布页面引入CSS文件进行整体控制。虽然润乾V4设计器不支持批量修改和CSS文件引入,但可以通过定义CSS类并在报表模板中应用来实现样式的自定义和批量修改。此外,文章还展示了如何解决已设置单元格样式与全局CSS冲突的问题。
摘要由CSDN通过智能技术生成

润乾报表单元格样式的设置,是针对每个单元格,样式作为单元格的属性加载在单元格中。报表提供的“添加到样式”功能将定义好的单元格样式添加到样式列表里,如果其他单元格的样式与定义过的单元格样式一样,那么就不用再重复设置,直接使用定义过的样式就可以了。设置了样式之后的单元格,该样式会作为单元格属性绑定在单元格中。
目前V4的设计器提供的样式设置功能不支持单元格样式的批量修改,也不支持CSS样式文件的设计器引入,但是报表发布页面中可以引入css文件对报表样式进行整体控制。

实现思路:
报表通过tag标签发布时,tag标签的name属性值(一般情况下设置name属性为report1)是报表在网页中的标识名,报表发布后会变成html的table,其id为report1,扩展后的单元格为table的td元素并且它们具有扩展后的id命名规则。因此可以定义控制html中table元素样式的css文件,并在报表展现的页面中引入css文件,这样就可以通过css控制报表单元格的样式。
下面的例子中实现了切换css样式文件达到报表换肤效果,通过单选按钮选择就可以完成css文件对报表样式的整体控制。
 
 

实现步骤:
1. css文件定义,分别定义两个css文件(a.css,b.css),在其中进行样式定义。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值