本文档的目的是明确说明报表设计用户如何通过CSS重载场景报表在网页上的个性化呈现效果。
本文档中罗列出来的都是V6.6.3版本所支持的系统css class(以下简称class),请遵循我们的命名规范。
- 场景工作表父节点className是”lcz-scene-wrapper”
本文档的面向读者有:报表设计人员,二次开发人员。
本文档的读者要有一定的CSS基础,尚未掌握该技能的读者可参考以下网站:CSS3
由于场景下各个子报表现在不是iframe引入,自定义样式会有冲突,解决方法是后台在自定义css前面统一加上实例的cacheId
场景工作表全局样式
工作表容器
/**
* 用户可自定义背景颜色、背景图片等样式;不建议在此样式定义高度、宽度等改变布局的样式
*/
.lcz-scene-wrapper {
background-color: rgba(207,207,207,0.7);
}
.lcz-scene-wrapper .lcz-content-wrapper {
}
.lcz-scene-wrapper .lcz-content-wrapper .lcz-sheet-content {
}
.lcz-scene-wrapper .lcz-content-wrapper .lcz-sheet-content .lcz-table-content {
}
场景标题栏
标题栏容器样式
/**
* 整个标题栏容器
* 用户可自定义背景颜色、背景图片等样式;不建议在此样式定义宽度、高度等改变布局的样式
*/
.lcz-scene-wrapper .lcz-scene-toolbar {
background-color: #fff;
}
标题
/**
* 工具栏页码区域
* 用户可自定义背景颜色、背景图片、间距、字体等样式
*/
.lcz-scene-wrapper .lcz-scene-toolbar li.lcz-scene-title {
}
### 单元格
/**
* 单元格容器
* 用户可个性化配置整个控件的字体、背景等相关样式
*/
.lcz-scene-wrapper .lcz-content-wrapper .lcz-sheet-content .lcz-table-content .lcz-table-cell {
}
控件样式
树
/**
* 字体颜色、大小
* 节点高度设置上下padding
*/
.lcz-scene-wrapper .lcz-tree-ctrl li a {
}
/**
* 复选框选中className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.checkbox_true_full{
}
/**
* 复选框选中触摸后的className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.checkbox_true_full_focus{
}
/**
* 复选框未选中触摸后的className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.checkbox_false_full_focus{
}
/**
* 复选框半选className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.checkbox_true_part{
}
/**
* 复选框半选触摸后的className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.checkbox_true_part_focus{
}
--------------------------------------------------------------------------------------
/**
* 单选框选中className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.radio_true_full{
}
/**
* 单选框选中触摸后的className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.radio_true_full_focus{
}
/**
* 单选框未选中className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.radio_false_full{
}
/**
* 单选框未选中触摸后的className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.radio_false_full_focus{
}
/**
* 单选框半选className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.radio_false_part{
}
/**
* 单选框半选触摸后的className
*/
.lcz-scene-wrapper .lcz-tree-ctrl li span.radio_false_part_focus{
}
作者:柳杨 创建时间:2023-09-09 18:29
最后编辑:柳杨 更新时间:2025-04-22 15:31
最后编辑:柳杨 更新时间:2025-04-22 15:31
