Переопределение 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
- Создайте папку в своем
WebRoot
дорожкаtemplate/themes/mytheme
- Извлеките загруженную тему и переключитесь в папку css
- переименовывать
jquery-ui-x.x.x.custom.css
вjquery-ui.css
- копия
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
папка.