html - Sencha - 将底部标题边框添加到面板

Question

我有一个面板(extjs 面板)，我只需要绘制面板标题的底部边框。

我使用 firebug 检查了我的 web 应用程序主题，有一个 css 属性允许绘制面板标题的底部边框:

.x-docked-top{
   border-bottom-width: 0 !important;  // neptune-theme.css
}

正如我所说，此属性是通过海王星主题模板设置的...因此我需要将此属性设置为“1”，如下所示:

.x-docked-top{
       border-bottom-width: 1 !important;  // myCustomCss.css
}

问题是我不知道为什么如果我在我的 myCustomCss.css 文件中写入上面的代码，它不起作用并且什么也没有发生。也许 !important 特性在 neptune-theme.css 中使用有主要优先级？

有人知道怎么解决吗？

Answer 1

我知道这个问题很老了，但我最近遇到了这个问题。不可能通过 Sencha 变量定位单个边框。我只在直接覆盖 CSS 方面取得了成功。

您指定的解决方案将不起作用，因为您缺少值后的单位。

.x-docked-top{
       border-bottom-width: 1px !important;  // myCustomCss.css
}

但是，类和过程在理论上应该有效。如果没有，其他一些类(class)可能更容易接受。这是我最终添加属性的类:

.x-panel-header-default-horizontal.x-header-noborder {
  border-bottom: 2px solid #BFBFBF !important;
}

除了底部我不想要边框。该属性会影响大多数组件，但少数情况除外，需要额外的覆盖。 (使用 Sencha ExtJS 6)