Question

这就是我对网格的看法

@(Html.Kendo().Grid<OPAMvc.Models.Parts>()
                        .Name("grd")
                        .Columns(columns =>
                        {
                            columns.Bound(o => o.Id).Title("Id No").Width(80).HeaderHtmlAttributes(new { style = "font-size: 8pt; font-weight: bold;" }).HtmlAttributes(new { style = "line-height: 1em;font-size: 7pt;" });
                            columns.Bound(o => o.Desc).Title("Description").Width(200).HeaderHtmlAttributes(new { style = "font-size: 8pt; font-weight: bold;" }).HtmlAttributes(new { style = "line-height: 1em;font-size: 7pt;" });
                            columns.Bound(o => o.Price).Title("Price").Width(50).Format("{0:c}").HeaderHtmlAttributes(new { style = "font-size: 8pt; font-weight: bold;" }).HtmlAttributes(new { style = "line-height: 1em;font-size: 7pt;" });
                            columns.Bound(o => o.Name).Title("Name").Width(20).HeaderHtmlAttributes(new { style = "font-size: 8pt; font-weight: bold;" }).HtmlAttributes(new { style = "line-height: 1em;font-size: 7pt;" });
                        })

我想知道是否有更好的方法来使用CSS设置标题样式。感谢。

Answer 1

我已经为样式Kendo grid应用了某种方法，如下所示，但我不确定它是否对您有所帮助。

用于定义Kendo网格的样式属性：

@(Html.Kendo().Grid<Model>()
  //define style properties at here
  .HtmlAttributes(new { style = "border:none; height:600px;" }) 
  //... code omitted for brevity
)

使用模板为网格的单个单元格设置样式： 要使用有条件选择的操作格式化Kendo Grid列值，您可以使用以下示例。有关详细信息：How Do I Have Conditional Logic in a Column Client Template?

<div id="grid"></div>

<script> 
function Getvalue(value) {
    // console.log(value);
    if (value && value != null && value.indexOf("A") == 0)
        return "<b style='color:red'>" + value + "</b>";
    else
        return "";
}

$(document).ready(function () {     
    $("#grid").kendoGrid({
        dataSource: localDataSource,
        columns: [
            {
                field: "FirstName",
                title: "First Name", template: '#=Getvalue(FirstName)#'
            }
        ],
    }); 
});
</script>

希望这会有所帮助......

Answer 2

单独设置网格标题样式的最常用方法是应用css规则。尝试以下

#grd .k-grid-header .k-header
{
   font-size: 8pt; 
   font-weight: bold;
}

此规则将获取您的“grd”标头类并应用样式

如何使用CSS设置kendo grid mvc的样式

2 个答案: