Блог

Главная - Вопросы по программированию - оформление сетки кендо — пользовательские стили

оформление сетки кендо — пользовательские стили

#kendo-ui #kendo-grid

#kendo-пользовательский интерфейс #кендо-сетка

Вопрос:

Я пытаюсь удалить серую рамку вокруг заголовка сетки. Как это можно сделать? Вот ссылка на скрипку: http://jsfiddle.net/tmLmk/7 /

Html-код:

 <div ng-controller="GridController">    
    <div kendo-grid k-options="options" k-data-source="sData"></div>
</div>

JS-код:

 angular.module('angular-kendo-example', ['kendo.directives']);

function GridController($scope) {
    $scope.options = {
        sortable: true,
        pageable: true,
        columns: [{
            field: "column1",
            title: "column 1",
            width: "40px"
        },{
            field: "column2",
            title: "column 2",
            width: "70px"
        },{
            field: "column3",
            title: "column 3",
            width: "70px"
        },{
            field: "column4",
            title: "column 4",
            width: "60px"
        },{
            field: "column5",
            title: "column 5",
            width: "40px"
        },{
            field: "column6",
            title: "column 6",
            width: "40px"
        }],

    };
    $scope.sData= [
        { column1: "column1 data", column2: "column2 data", column3: "column3 data", column4:  "column4 data",  column5: "column5 data", column6: "column6 data"  }, { column1: "column1 data", column2: "column2 data", column3: "column3 data", column4:  "column4 data",  column5: "column5 data", column6: "column6 data"  }, { column1: "column1 data", column2: "column2 data", column3: "column3 data", column4:  "column4 data",  column5: "column5 data", column6: "column6 data"  }
    ];
}

Спасибо

Комментарии:

1. Вы имеете в виду без изменения цвета других строк таблицы?

2. Да, мне просто нужно удалить толстую границу заголовка в сетке, как это можно сделать?

3. Я добавил идентификатор в ваш раздел данных в вашей скрипке , но не знаю Kendo. Возможно, вас заинтересует изменение шаблона строки в пользовательском интерфейсе Kendo

4. спасибо за ответ, но я все еще вижу серую рамку в верхней части заголовка в измененной вами ссылке на скрипку. Как это можно удалить?

Ответ №1:

Если вас устраивает CSS-решение, попробуйте следующее:

 .k-grid-header table[role='grid']{
    border-spacing:0px;
}

Дайте мне знать, если это не желаемый результат.