お世話になります。
ポータルのCSSについてモバイル版の調整をしたく、スマートフォン用のCSSファイルをアップロードしました。
例えば、以下のコードはPC用では正しく動作します。
.ocean-portal-announcement-text div img {
width:50px!important;
}
しかしながら、モバイル版では恐らく動的にJSがモバイル版で要素を再構築していることから同じセレクタではCSSを適用させることができません。
基本的な質問なのですが、どのようにしたら、CSS適用させたい要素をモバイル版で調べればよいのでしょうか?
宜しくお願い申し上げます。
下記がご参考になると思います。
Qiita kintone 開発で Chrome デベロッパーツールを使おう
Chrome でモバイル表示すると、DOM を調べられます。
コメントありがとうございます。
kintone.events.on('portal.show', function(event) {
kintone.mobile.app.record.get()
})
では何も表示されないため、記事にあるようにアプリ詳細画面等でしかDOM構造が出力されないのではと思われます
宜しくお願い申し上げます。
誤解があるようです。
kintone.mobile.app.record.get() は、アプリ詳細画面等でレコード情報を取得する関数です。
「開発で Chrome デベロッパーツールを使おう」のモバイル表示のDOM操作の部分を見てください。
https://qiita.com/rex0220/items/58122efda9f94f669ec4#%E3%83%A2%E3%83%90%E3%82%A4%E3%83%AB%E8%A1%A8%E7%A4%BA
Chrome でモバイル表示のポータル画面を見る手順です。
・Chrome でポータル画面を表示
・Chrome デベロッパーツールで、モバイル表示に切り替え
・画面を再表示
・デベロッパーツールで、Elements タブを見ると DOM 構造が分かります。
コメントありがとうございます。
デベロッパーツールの使い方を誤解しておりました。モバイル版に切り替えても普段、DOM構造がわからないなと
思っていましたが、再表示すると切り替わるのですね。
助かりました、宜しくお願い申し上げます。