CSS : EL 树形控件-设置字体大小和设置一些颜色

Grayson.Shang

EL树形控件.fgcc (1.2 MB, 下载次数: 95)

胡 · 胡

本帖最后由胡于 2024-8-31 15:10 编辑

EL-CSS 在楼下，这是系统模板里的CSS，看不懂但感觉有用的css

/*库存管理系统的CSS 开始*/
.divided-line-vertical{
width: auto;
height: auto;
background-color: #5820f8;
border-radius: 15px;
}
.radio-selection{
border-radius: 5px;
padding: 8px 16px 8px 16px;
box-shadow: 0 0 3px #888888;
}
.hyperlink-padding{
padding-left: 10px;
}
.img-button-pd3{
padding: 3px;
box-shadow: none !important;
}
.img-button-pd8{
padding: 8px;
box-shadow: none !important;
}
/* el-组件样式 */
/* el-input */
.el-input-cus-number{
text-align: right;
}
/* padding */
.pd-3 {
padding: 3px;
}
.pd-4 {
padding: 4px;
}
.pd-5 {
padding: 5px;
}
.pd-6 {
padding: 6px;
}
.pd-7 {
padding: 7px;
}
.pd-8 {
padding: 8px;
}
.pd-9 {
padding: 9px;
}
.pd-10 {
padding: 10px;
}
/* toolbarnav */
.toolbarnav-left ul {
justify-content: flex-start;
}
.toolbarnav-center ul {
justify-content: center;
}
.toolbarnav-right ul {
justify-content: flex-end;
}
.toolbarnav ul {
box-sizing: inherit;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
align-items: center;
}
.toolbarnav li>a {
padding: 3px 16px !important;
max-height: 40px;
}
.toolbarnav li>a span {
margin: 0 !important;
line-height: 24px !important;
}
.toolbarnav li>a div[elemtype="icon"] {
margin-right: 6px !important;
}
.toolbarnav li {
width: auto !important;
margin: 0 3px !important;
}
.toolbarnav {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
align-items: center;
}
.wrap-centenr .fgc-align__inner {
justify-content: center !important;
}
/* menu */
.menuContainerStandard li{
margin: 0 5px auto;
}
/* el-select */
.menu-bar-select{
border: 5px solid white;
}
.menu-bar-select .el-select:focus{
border-color: white !important;
}
/* action-bar */
.fgc-bpm-panel-actionbutton, .fgc-bpm-panel-morebutton{
width:80px;
height: 32px;
line-height: 32px;
text-align: center;
}
.action-bar-right{
display: flex;
float: right;
}
/* image-text-view-list */
.tight-card-list{
padding: 2px;
}
.el-menu--horizontal{
border-bottom: 0px !important;
}
/* group-button */
.group-button {
border-right: 1px solid #dcdfe6;
}
.group-button label{
margin-right: 0px !important;
border-right: 0px;
}
/* table-selected */
.SPanel-header{
margin: 0px 0px !important;
padding: 0px 0px !important;
}
/* scroll */
::-webkit-scrollbar {
width: 12px;
height: 12px;
/* background-color: transparent; */
}
::-webkit-scrollbar-thumb {
background-color: rgba(0,0,0,.3);
border-radius: 8px;
border: 2px solid transparent;
background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover {
background-color: rgba(0,0,0,.5);
}
/*库存管理系统的CSS 结束*/

复制代码

胡 · 胡

本帖最后由胡于 2024-8-31 15:11 编辑

.el-select__selected-item{
user-select: auto;/*EL禁用选择器文本可以选中*/
}
html:root{
--el-disabled-text-color: #000000;/*EL禁用字体颜色*/
--el-disabled-bg-color: #F7F7F7;/*EL禁用背景颜色*/
--el-fill-color-light:#F7F7F7;/*EL禁用选择器背景颜色*/
}
input:disabled, textarea:disabled, select:disabled {
opacity: 1 !important;/*EL禁用字体透明度*/
}
/*EL禁用鼠标模式---------------------------------------- 以下*/
.el-input.is-disabled,
.el-input.is-disabled .el-input__icon,
.el-select .el-input.is-disabled .el-input__wrapper,
input,
.el-select__wrapper.is-disabled,
select,
textarea {
cursor: text !important;/*EL禁用鼠标模式*/
}
/*EL禁用鼠标模式------------------------------------------ 以上*/
.el-cascader-menu__wrap.el-scrollbar__wrap {
height: 300px; /*EL级联选择器下拉框高度*/
}
.el-cascader__suggestion-list {
max-height: 300px;/*EL级联选择器搜索后下拉框高度*/
}
/*设置EL 树形控件字体为16px */
.el-tree {
font-size: 16px;
}
/*设置EL 树形控件选中背景和选中字体颜色 */
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
background-color: #015293;
color: #ffffff;
}
/*设置EL 级联选择器内边距为0 */
.el-cascader-custom .el-cascader{
padding: 0;
}

复制代码

遇见未知的自己 · 遇见未知的自己

太棒了，感谢分享

牧野流云 · 牧野流云

高级，谢谢分享！

muto · muto

感谢分享！！！！！

		自动登录	找回密码
密码			立即注册

[资源分享] CSS : EL 树形控件-设置字体大小和设置一些颜色

评分

5 个回复

悬赏达人

时代开发者征文活动

圣诞拼拼乐

微信认证勋章