盒子论坛 v2.1

有时候需要去掉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 one
  of them, it will take effect.

2)LayoutConfig.Cls will take effect correspording to customCSS,what is the
  difference between LayoutConfig.BodyCls and LayoutConfig.Cls?
  BodyCls will apply the css class to body of the component. cls will apply
  to very top and it will effect all inherited html elements.
----------------------------------------------
生活愉快.

作者：

dmzn (dmzn)	★☆☆☆☆	-
	盒子活跃会员

2021/9/3 0:44:49

1楼：

运行时使用代码设置css样式:
with Splitter1.J SInterface do
begin
  J 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存放在外部文件，配置变更时便于修改，无需重新编译代码。
----------------------------------------------
生活愉快.

信息

登陆以后才能回复