如何隐藏网格标题kendo ui?

Pea*_*ind 12 css jquery kendo-ui kendo-grid

我正在使用层次结构网格kendo ui.我想隐藏网格标题.目前,我使用下面的代码,但是,只隐藏标题的文本.

// kendo ui grid
.TableHtmlAttributes(new { @class = "GridNoHeader" })

// css
.GridNoHeader thead.k-grid-header
{
    height: 0;
    border-bottom-width: 0;
    visibility: hidden;
    overflow: hidden;
}
Run Code Online (Sandbox Code Playgroud)

如果可以,请分享您的经验.谢谢

git*_*tgo 17

这是一种jQuery方法,您可以在网格初始化后立即运行:

$("#grid .k-grid-header").css('display', 'none');
Run Code Online (Sandbox Code Playgroud)

它隐藏了整个标题,并且稍微好于css解决方案,因为它将样式直接应用于标题作为内联样式,这意味着该样式自动优先于所有其他kendo样式.


关于你当前的方式,它只隐藏文本因为visibility:hidden会隐藏元素,但仍然为它分配空间.试试吧display:none.此外,k-grid-header该类应用于div包含整个标题的元素,而不是thead.也许试试这个:

.GridNoHeader div.k-grid-header
{
    height: 0;
    border-bottom-width: 0;
    display: none;
    overflow: hidden;
}
Run Code Online (Sandbox Code Playgroud)


Pea*_*ind 5

要隐藏网格标题,请使用以下代码:

.GridNoHeader .k-grid-header
{
    height: 0;
    border-bottom-width: 0;
    display: none;
    overflow: hidden;
}
Run Code Online (Sandbox Code Playgroud)