Переопределение Struts2 jqGrid CSS

Я застрял на переопределении по умолчанию struts2-jquery-plugin таблица стилей для сетки. Я попытался определить свою собственную таблицу стилей (jquery-ui-grid.css) и включив его на мою страницу JSP, но фреймворк всегда загружает CSS по умолчанию (ui.jqgrid.css) последний и переопределяет мои собственные стили.

Я использовал инструменты разработчика Chrome для наблюдения за сетевыми запросами, чтобы убедиться, что загружаются как CSS по умолчанию, так и мой пользовательский CSS, но применяется только значение по умолчанию (я полагаю, потому что оно было загружено последним). Поскольку этот CSS по умолчанию генерируется struts2 Framework, я понятия не имею, как я могу изменить / переопределить его, так как я не знаю путь к этому файлу. Я сейчас пользуюсь maven управлять своими зависимостями и тому struts2-jquery-plugin а также struts2-jqgrid-plugin включаются из maven,

Я пытаюсь изменить размер шрифта для своих сеток, и в этот момент я немного отчаялся...

Как я могу переопределить / изменить файл CSS по умолчанию, который плагин использует для стилизации сеток? Я не хотел бы менять стили, применяемые к таблицам HTML, я ищу решение, которое позволило бы мне специально изменить jqGrid связанные классы CSS.

РЕДАКТИРОВАТЬ:

Как уже упоминалось в этом вопросе, я включил свой CSS после jquery-ui одни (внутри <head /> тег):

<head>
...
<s:head />
<sj:head jqueryui="true" jquerytheme="south-street" loadAtOnce="true"  loadFromGoogle="false" locale="es"/>
<link href="<s:url value='/styles/main.css'/>" rel="stylesheet" type="text/css" media="all" /> 
...
</head>

И внутри моего main.css принадлежат все CSS импорта:

/*
   Css Framework 
   =============
     - see http://www.contentwithstyle.co.uk/Articles/17/a-css-framework
       for more info.
*/
@import url("tools.css");
@import url("typo.css");
@import url("forms.css");
@import url("layout.css");
/* This is my "custom" jqGrid stylesheet: */
@import url("ui.jqgrid.css");
@import url("dl-forms.css");

ОБНОВЛЕНИЕ ПРОГРЕССА
Я все еще не смог переопределить так, как хотел, поэтому на данный момент мне пришлось прекратить использовать тему jquery-ui из Интернета (я предпочитаю так, чтобы я мог обновлять ее на лету, так как нет Необходимость основных настроек в jQuery UI CSS для моего веб-приложения).
Я скачал тему, которую я использую, и поместил ее в мое веб-приложение (template/themes/myTheme-name/), поэтому я мог заставить фреймворк использовать эту явную тему вместо ее загрузки, и это действительно сработало, теперь я могу изменить свой "пользовательский" CSS для jqGrid. Но я чувствую, что это всего лишь обходной путь, и я хотел бы знать, как это сделать чистым способом.

1 ответ

Это шаги для создания / изменения пользовательской темы:

Создайте и загрузите свою собственную тему с помощью jQuery ThemeRoller

  1. Создайте папку в своем WebRoot дорожка template/themes/mytheme
  2. Извлеките загруженную тему и переключитесь в папку css
  3. переименовывать jquery-ui-x.x.x.custom.css в jquery-ui.css
  4. копия jquery-ui.css и папку изображений в template/themes/mytheme папка.

<%@ taglib prefix="s" uri="/struts-tags"%> 
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%> 
<html>   
   <head>
    <s:url var="context" value="/" />
    <sj:head locale="de" jqueryui="true" jquerytheme="mytheme" customBasepath="%{context}template/themes"/>   
   </head>
   <body>  
   </body> 
</html>

Вы также можете играть с scriptPath атрибут, где вы можете разместить свой код JS. Так же, как вы делаете это с помощью CSS, но копируете в js папка.

Другие вопросы по тегам