パーツCSS

1. CSSファイル

汎用パーツをデザインするCSSは外部ファイル「gcparts-X.Y.Z.css」に集約されています。
※ファイル名の「X.Y.Z」はバージョンを表します。

パーツデザインCSSファイルの記述内容を変更する、あるいは別のCSSファイルでスタイルの上書きをすることで、サイトに合わせた任意のデザインに変更が可能です。

各々のパーツは、外枠（DIV要素）に囲まれたHTML断片で出力されており、その外枠のDIV要素には各パーツ用のCLASS属性値が命名されています。

パーツデザインCSSファイルにはそのクラスセレクタ別のCSSデザインが記述されており、パーツごとにデザインを区別しています。
したがって、とあるパーツのCSSプロパティを変更しても、他のパーツのデザインに影響を及ぼすことはありません。

各パーツのCSSセレクタは、前述の個別説明中の「関連CSSセレクタ」に記載されています。

2. パーツデザインの色調・文字サイズ

①　色調

汎用パーツは、白～淡いグレーを基調としています（一部、淡水色など有彩色の使用箇所あり）。

②　文字サイズ

共通CSS（gccommon.css）により、ページ全体について16ピクセルに設定されています。
汎用パーツは共通設定の16ピクセルの文字サイズを基本とした上で、以下のパーツについて個別にフォントサイズを設定しています。

  • A) パネル（BASICPANEL01）・・・見出し要素（H1要素：120%、H2要素・H3要素：110%）
  • B) テーブルフォーム（TABLEFORM01）・・・見出し文言：14ピクセル、その他文言：12ピクセル
  • C) ラベル再定義フォーム（RELABELFORM01）・・・フォームタイトル：16ピクセル、フッター文言は：ピクセル、その他文言：14ピクセル
  • D) 画像付リスト（IMAGELIST01）・・・13ピクセル（先頭テキストのみ16ピクセル）
  • E) テキストメニュー（TEXTMENU01）・・・小リンクビュー：12px、並列アイコンビュー：75%
  • F) 背景付きメニュー（IMAGEMENU01）・・・小リンクビュー：12px、並列アイコンビュー：75%
  • G) 列削除テーブル（TRIMTABLE01）・・・14ピクセル

3.　ベンダープレフィックス付きCSSプロパティ

Webkitベンダープレフィックス（-webkit-）付きのみ記載します。プレフィックスなしのCSSプロパティや他のベンダープレフィックス記述の対応はCSS変換機能により行います。

4.　Internet Explorerでの表示

パーツの多くはCSS3を使ってデザインされています。Internet Explorer 9以上はCSS3に対応していますが、PCブラウザで使用される8以下は非対応です。
Internet Explorer 9でCSS3で対応させるには、以下のMETA要素をテンプレートのHEAD要素内に記述してください。
<meta http-equiv="X-UA-Compatible" content="IE=9" />