0

我有一个 jqGrid，它带有默认背景图像，我想更改它的背景图像。我尝试了网上建议的几种方法

方法 1. 我在我的 CSS 中添加了以下代码

.ui-jqgrid .ui-widget-header
{
    background-image:url(images/my-header.png) repeat-x !important;
}

方法2.添加下面的代码来加载jqGrid的完成事件

loadComplete: function () {
    $("#gview_jqgCUST .ui-jqgrid-titlebar").removeClass('ui-widget-header');
    $("#gview_jqgCUST .ui-jqgrid-titlebar").addClass('jqgrid-header');
}

在我添加的 CSS

.jqgrid-header{
    background:red url(images/my-header.png) repeat-x scroll 50% 50%;
    border:1px solid black;
    color:Blue;
    font-weight:bold;
}

我在 jqGrid css 文件之后加载 css 文件但无法实现

我该怎么做 ？？请提供任何示例代码...我是 jqGrid 和 jQuery 的新手...

4

1 回答 1

3

首先，您可以使用jQuery UI 的ThemeRoller来自定义您在页面上使用的主题。您可以通过使用“CSS Scope”将主题的应用减少到页面的某个部分（参见答案）。

或者，您可以指定background. 该演示使用“Dot Luv”主题的背景。除了我指定了文本和边框的颜色以使标题的外观更好。我使用了 CSS.ui-jqgrid .ui-widget-headerbackground

.ui-jqgrid .ui-widget-header {
    border: 1px solid #0b3e6f;
    background: #0b3e6f url(http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/themes/dot-luv/images//ui-bg_diagonals-thick_15_0b3e6f_40x40.png) 50% 50% repeat-x;
    color: #f6f6f6;
}

生成的网格如下图所示

在此处输入图像描述

于 2013-06-27T06:44:17.650 回答