接到一个大屏展示的业务,EasyUI原生滚动条太丑,文档上还没有滚动条的说明,再此记录
/* 滚动条 */
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
.datagrid-body::-webkit-scrollbar {width:8px; height:5px; background-color:transparent;}
/*定义滚动条轨道 内阴影+圆角*/
.datagrid-body::-webkit-scrollbar-track {background-color:transparent; }
/*定义滑块 内阴影+圆角*/
.datagrid-body::-webkit-scrollbar-thumb {background-color:rgb(221,222,224); border-radius:6px;}
选中行背景色
/* 选中样式 */
.datagrid-row-selected{
background:#1c6aad
}
表格光标悬浮样式
/* 表格光标悬浮样式*/
.datagrid-row-over{
background: #7594ad
}
表头光标悬浮样式
/* 表头光标悬浮样式*/
.datagrid-header td.datagrid-header-over{
background: #7594ad
}
表格背景色
/* 表格背景色*/
.datagrid-header,.panel-body{
background: transparent;
background-color: transparent;
}
.datagrid-view{
border:none;
}
.panel{
border:none;
}
/* 表格背景色*/
字体样式
/* 字体样式*/
.datagrid-cell,
.datagrid-cell-group,
.datagrid-header-rownumber,
.datagrid-cell-rownumber {
margin: 0;
padding: 0 4px;
white-space: nowrap;
word-wrap: normal;
overflow: hidden;
height: 18px;
line-height: 18px;
font-weight: normal;
font-size: 10px;
font-family: SimHei;
color: #b3daeb;
}
|