uniGUI: 通过css设置Panel的四个边框
作者:
dmzn (dmzn)★☆☆☆☆-盒子活跃会员2021/9/3 0:43:06标题:uniGUI: 通过css设置Panel的四个边框浏览:26加入我的收藏楼主:有时候需要去掉Panel的某些边框,实现方法是将边框的border-color置为透明。方法如下:1.在ServerModule.CustomCSS编写css配置:.x-panel-border-none /*border: none*/{border-color:transparent transparent transparent transparent;/*顺序: 上 右 下 左*/}.x-panel-border-topbottom /*border: top bottom*/{border-color:#99bbe8 transparent #99bbe8 transparent;}.x-panel-border-leftright /*border: left right*/{border-color:transparent #99bbe8 transparent #99bbe8;}2.设置Panel的边框样式LayoutConfig.BodyCls = 'x-panel-border-topbottom'以下说明来自官方论坛的讨论:1)The same css code in customFiles and customCSS ,wich code will take effect?It is based on the css code. For example if you have "!important" in oneof them, it will take effect.2)LayoutConfig.Cls will take effect correspording to customCSS,what is thedifference between LayoutConfig.BodyCls and LayoutConfig.Cls?BodyCls will apply the css class to body of the component. cls will applyto very top and it will effect all inherited html elements.----------------------------------------------生活愉快.作者:
dmzn (dmzn)★☆☆☆☆-盒子活跃会员2021/9/3 0:44:491楼:运行时使用代码设置css样式:with Splitter1.J SInterface dobeginJ SConfig('border', [true]);J SConfig('bodyBorder', [True]);//设置组件的属性J SCall('setStyle', ['border-style', 'solid none dashed none']); //通过代码设置样式//J SCall('setStyle', ['border-color', '#99bbe8 transparent #99bbe8 transparent']);J SCall('addCls', ['x-panel-border-topbottom']); //通过CustomCSS设置样式end;推荐将css存放在外部文件,配置变更时便于修改,无需重新编译代码。----------------------------------------------生活愉快.