-
-
xiaocesen 初学数据Lv2
发表于2021-9-26 17:23
楼主
本帖最后由 xiaocesen 于 2021-9-26 17:23 编辑
有些时候我们想要自定义设计报表样式风格，可以使用脚本入口，这种时候需要我们会写基础的js来更改样式，往往比较难懂，不易理解。
ABI中添加了报表自定义样式入口，这个时候我们想要达到自定义样式的需求时，可以直接在此入口修改我们报表的CSS样式，如下。代码入口：
1.1当我们想要整体修改报表中表格边框宽度颜色时。代码：
复制代码效果：
1.2而有些时候我们又想要不同的表格能展示不同的样式。
代码：
复制代码
想要更改哪一个组件的样式更换组件代号即可。
效果：
1.3我们可以通过此方法更改表格内边框颜色。
代码：
复制代码效果：
1.4还有我们想要修改的表格边框为圆角。
代码：
复制代码
2.1对于熟悉CSS的同学，我们更是可以更为方便快捷的应用于各类组件
。
灵活运用浏览器中的F12功能取到我们想要自定义样式组件的id名或类名。
代码：
复制代码
注意！！！相应名称后有空格！！！
取到相应的名称后便可更改其中字体，字号，颜色。
效果：
有些时候我们想要自定义设计报表样式风格，可以使用脚本入口，这种时候需要我们会写基础的js来更改样式，往往比较难懂，不易理解。
ABI中添加了报表自定义样式入口，这个时候我们想要达到自定义样式的需求时，可以直接在此入口修改我们报表的CSS样式，如下。代码入口：
1.1当我们想要整体修改报表中表格边框宽度颜色时。代码：
- table table{
- border-style: solid;
- border-width: 3px;
- border-color: orange;
- }
1.2而有些时候我们又想要不同的表格能展示不同的样式。
代码：
- div#GRID1 table{
- border-style: solid;
- border-width: 3px;
- border-color: orange;
- border-radius: 1em;
- }
想要更改哪一个组件的样式更换组件代号即可。
效果：
1.3我们可以通过此方法更改表格内边框颜色。
代码：
- div#GRID1 table tr td {
- border: 3px solid #5ac8fa;
- }
1.4还有我们想要修改的表格边框为圆角。
代码：
- table table tr:hover {background-color: #5ac8fa;}
2.1对于熟悉CSS的同学，我们更是可以更为方便快捷的应用于各类组件
灵活运用浏览器中的F12功能取到我们想要自定义样式组件的id名或类名。
代码：
- div#HHH15 .xtabctrl .xtab-header .xtab-header-text{
- font-size: 20px;
- color:red;
- font-family:"仿宋";
- }
注意！！！相应名称后有空格！！！
取到相应的名称后便可更改其中字体，字号，颜色。
效果：
最近看过此主题的会员
1个回答
-
feng6884350 小试身手Lv3
沙发
本帖最后由 feng6884350 于 2023-5-26 09:13 编辑
div#GRID1 table{
border-style: solid;
border-width: 3px;
border-color: orange;
border-radius: 1em;
} 这个设置边框可以设置颜色，。但是圆角没效果哦！
