CSSの使い方

kintone カスタマイズ
1

お世話になります。

フォーム上にスペースフィールド(address_btn_space)を置いて、これの上に

javascriptでボタン(id:address_btn)を作ったのですが、このボタンをCSSで

カスタマイズしたいのですが、どうすればいいかご教示ください。

よろしくお願いします。

2

玉木善朗様

お世話になっております。
トヨクモの江田と申します。

こちらの記事などがわかりやすいかと思います．
https://www.webnoiroha.net/webdesign/css/id-and-class/

例えば，ボタン(id:address_btn)の文字サイズを大きくするのであれば下記のようになります．

・sample.css

#address_btn{
  font-size: 200%;
}

kintoneへの設定は，JavaScriptと同様に「アプリの設定 > JavaScript/CSSでカスタマイズ」の画面からファイルを登録すれば良いです．

3

質問した事項については解決しました。ありがとうございました！

便乗になるのですが、スペースフィールド(address_btn_space)にCSSで色をつけるにはどうしたらいいでしょうか？

色々調べてみましたが、よくわかりませんでした。

低レベルな質問で申し訳ありませんが、よろしくお願いします。

4

玉木善朗様

お世話になっております。

JavaScriptでスペースフィールドにclassを追加して，そのclassに対してCSSでstyleを指定すればよいです．

・JavaScript

(function() {
  "use strict";
  kintone.events.on([
    'app.record.detail.show',
    'app.record.create.show',
    'app.record.edit.show',
  ], function(event){
    kintone.app.record.getSpaceElement('address_btn_space').classList.add('address_btn_space');
  });
})();

・CSS

.address_btn_space{
  background: #f00;
}
5

回答ありがとうございます。

コピペして試してみましたがうまくいきませんでした。

何が悪いのでしょうか。。。