2021/05/09

MANUAL

テーブルの管理:エディタ:項目の詳細設定:フィールドCSS

## 概要 「入力項目」の「[表示名](/manual/table-management-label-text)」のラベルを含む、項目のフィールド要素にCSSを適用する場合に使用します。CSSクラス名を指定することで、各項目に任意のクラス名を指定し、「[スタイル](/manual/table-management-style)」を適用することができます。 ## 制限事項 1. 「[コメント項目](/manual/table-management-comments)」では使用できません。 ## 前提条件 1. 設定を行うには「サイトの管理権限」が必要です。 ## 動作イメージ 「[分類項目](/manual/table-management-class)」の「フィールドCSS」に「field-test」、「[コントロールCSS](/manual/table-management-extended-control-css)」に「control-test」というクラス名を指定します。 ![image](/binaries/2d9a44335a5c4ba2800c7dd5ca5cac3a) ![image](/binaries/c3574977195e4653ae599912d1eed3ad) ![image](/binaries/25fd51a7283c445ebf52fa7c14b6ee42) 指定したクラスに対して以下のようにスタイルを設定します。(ここでは新規作成にチェック) ##### CSS ``` .field-test { background-color: red; } .control-test { background-color: green; } ``` 新規作成で以下のように表示されます。 ![image](/binaries/9d04f7f4adc4490cad8484874f4eb316) ![image](/binaries/95261cf7430c42f09a768da44025662f) フィールドCSSではラベルの装飾、レイアウト調整、項目の表示非表示、コントロールCSSでは入力欄のサイズ変更、項目の値の取得などに使用できます。 ## 関連情報 <div id="ManualList"><ul><li><a href="/manual/table-management-class">テーブルの管理:項目:分類</a><span>2021/05/09 up</span></li> <li><a href="/manual/table-management-comments">テーブルの管理:項目:コメント</a><span>2021/05/22 up</span></li></ul></article> <ul><li><a href="/manual/table-management-label-text">テーブルの管理:エディタ:項目の詳細設定:表示名</a><span>2021/05/09 up</span></li> <li><a href="/manual/table-management-extended-control-css">テーブルの管理:エディタ:項目の詳細設定:コントロールCSS</a><span>2021/05/09 up</span></li></ul></article> <ul><li><a href="/manual/table-management-style">テーブルの管理:スタイル</a><span>2021/05/11 up</span></li></ul></article> <ul><li><a href="/manual/style">開発者向け機能:スタイル</a><span>2021/06/12 up</span></li></ul></article></div><input id="SearchTextHidden" type="hidden" value="" />
このページをシェアする