1

struts2-jquery-pluginグリッドのデフォルトのスタイルシートをオーバーライドすることに行き詰まっています。独自のスタイルシート ( ) を定義jquery-ui-grid.cssして JSP ページに含めようとしましたが、フレームワークは常にデフォルトの CSS ( ui.jqgrid.css) を最後にダウンロードし、独自のスタイルをオーバーライドします。

Chrome 開発者ツールを使用してネットワーク リクエストを監視したので、デフォルトの CSS とカスタム CSS の両方がダウンロードされていることを確認できましたが、適用されているのはデフォルトの CSS だけです (最後にダウンロードしたためだと思います)。このデフォルトCSS は Struts 2 フレームワークによって生成されるため、このファイルへのパスがわからないため、どのように変更/上書きできるかわかりません。

現在、Maven を使用して依存関係を管理しており、struts2-jquery-plugin Mavenstruts2-jqgrid-pluginから含まれています。

グリッドのフォントサイズを変更しようとしていますが、この時点で少し必死になっています...

プラグインがグリッドのスタイル設定に使用しているデフォルトの CSS ファイルをオーバーライド/変更するにはどうすればよいですか? HTML テーブルに適用されるスタイルを変更したくありません。関連する CSS クラスを具体的に変更できるソリューションを探しています。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のところ、インターネットから提供されたテーマの使用を停止する必要がありました (私はその方法を好みます。 webapp の jQuery UI CSS を微調整します)。
使用しているテーマをダウンロードして webapp ( template/themes/myTheme-name/) 内に配置したので、ダウンロードする代わりにその明示的なテーマをフレームワークに強制的に使用させることができました。実際に機能し、jqGridのカスタムCSS を変更できるようになりました。しかし、これは単なる回避策であると感じており、クリーンな方法で行う方法を知りたい.

4

1 に答える 1

0

カスタム テーマを作成/変更する手順は次のとおりです。

jQuery ThemeRollerで独自のテーマを作成してダウンロードする

  1. WebRootパスにフォルダーを作成するtemplate/themes/mytheme
  2. ダウンロードしたテーマを解凍し、css フォルダーに切り替えます
  3. jquery-ui-x.x.x.custom.cssに名前を変更jquery-ui.css
  4. jquery-ui.cssimagesフォルダーをフォルダーにコピーし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>

scriptPathJS コードを配置できる属性で遊ぶこともできます。CSSで行うのと同じ方法ですが、jsフォルダーにコピーします。

于 2015-08-22T11:11:06.660 に答える