2021/04/30

MANUAL

FAQ:カスタマイズ:複数の項目に同じスタイルを適用したい

## 概要 複数の項目に同じスタイルを適用する際、それぞれのセレクタへ個別にCSSを適用することもできますが、「CSSクラス名」機能を用いると一つのclassセレクタで同内容を実装することが可能です。 ## 事前準備 以下は編集画面にて分類A、数値A、日付A項目の背景色を黄色に変更する設定方法です。 1. 対象のテーブルを開きます。 1. 管理→テーブルの管理をクリックします。 1. エディタタブを選択します。 1. 現在の設定から分類A項目を選択し、詳細設定ボタンをクリックします。 1. CSSクラス名項目へ任意の名前を入力します。 ※今回は例として「color-yellow」と入力します。 1. 4と5の操作を数値A, 日付A項目にも行います。 1. スタイルタブを開きます。 1. 新規作成ボタンをクリックし、ダイアログを表示します。 1. タイトルに「分類A, 数値A, 日付A項目の背景色を黄色にする」等の任意のタイトルを入力します。 1. スタイル欄に以下のスタイルを入力します。 ##### CSS ``` .color-yellow input{ background-color:yellow; } ``` 11. 出力先の「全て」のチェックを外し、「編集」のみにチェックを入れます。 12. ダイアログの変更ボタンをクリックします。 13. 画面下部の更新ボタンをクリックします。 14. 対象テーブルの編集画面などを確認し、分類A, 数値A, 日付Aの項目背景が黄色になっていることを確認します。 ※5にて、複数のクラスを設定したい場合は半角スペースで区切って入力してください。 (例) 「color-yellow textcolor-red」 【関連マニュアル】 ・[テーブルの管理06:エディタ - 詳細設定「CSSクラス名」を指定する](/manual/1469619)
このページをシェアする