如何在Ext JS网格面板中删除标题边框？

Question

我有一个网格面板，我想完全隐藏标题。我正在使用hideHeaders: true配置选项，但它仍然在标题所在的位置留下一个微弱的1px蓝色边框。我怎么能没有1px蓝色标题？

这是显示问题的JSFiddle。

VS

我知道这似乎是一个微妙的差异，但在我的应用程序中，边框看起来非常糟糕。我认为这将完全删除标题，但它没有：

Ext.create('Ext.grid.Panel', {
    store: store,
    hideHeaders: true
});

Answer 1

我正在使用此sass块来设置列标题的样式：

.x-grid-header-ct{
    border-bottom: 1px solid #ecedee;
    padding-left: 15px;
    .x-column-header {
        border: none;
        background: none;
        .x-column-header-inner{
            padding: 10px 15px 15px 7px;
            &:before{
                border: none;
            }
            .x-column-header-text{
                color: #222;
                white-space: normal;
                font-size: 18px;
            }
        }
        .x-column-header-over{
            background: none;
            .x-column-header-trigger{
                display: none;
                background-color: white;
            }
        }
        .x-column-header-inner-empty{
            background: none;
        }
    }
}