ホーム » Movable Type » A-Form » A-Form ドキュメント » CSSでデザインカスタマイズ

CSSでデザインカスタマイズ

←A-Form ドキュメントTOPに戻る 

デザインテーマを使って変更する

デザインテーマを2種類用意しています。
詳しくは、A-Formのインストールと初期設定のデザイン変更の項を参照してください。

以下は、ご自身でスタイルシートを編集してカスタマイズする際のTipsを記述します。

特定の項目だけ色を変更する

管理画面で、色指定したい項目のID値を確認します。（このID値は任意に変更することができます）
ID値が、

　　ID値：abc

に設定した場合、入力画面では、

  <input id="abc">

といったidが設定されます。
そこでCSSで

  input#abc{
  　　　background: #fcc;
  }

といった記述をすると、項目abcに背景色を指定することができます。

同ID値の要素を、特定のフォームだけ色を変更する

例）フォーム番号20の　項目ID：abcの要素だけ色変更したい

フォームは

<div id="aform-20" class="aform">
....（フォームの内容）....
</div>

というようにフォームIDのついたdiv内に書き出されますので、

CSSで

　　#aform-20 input#abc{
　　　　background: #fcc;
　　}

と記述すると、フォーム番号20 の　abc　だけ色変更することができます。