ステータスバーの高さを取得してHTMLに適用できますか？

Question

私はWebアプリケーションを作成しており、私はcordova/phonegapを使用しています。

私はこのアプリでは異なるテーマを持っており、テーマでステータスバーの色を変更したいと考えています。だから私は固定された透明な（半透明の）ステータスバーを使ってフルスクリーンでアプリを作って色がその背後で変わるようにした。 HTMLでは、ステータスバーに小さなトップpadding:20pxを追加しました。

ステータスバーがすべてのアンドロイドデバイスで同じサイズではなく、ステータスバーがheight:20pxに設定されていますが、一部のデバイスでは20pxではありません。

デバイスのステータスバーの高さを取得し、HTMLのステータスバーの高さに適用できますか？

ご協力いただきありがとうございます。

Answer 1

私が探しているものが見つかりました。私は、肖像画には3.90625vh、風景には6.94444vhを使いました。私のCSSで私は持っています：

@media screen and (orientation:portrait) { 
     .statusbar { height: 3.90625vh; } 
} 
@media screen and (orientation:landscape) { 
     .statusbar { height: 6.94444vh; } 
} 

この方法はすべてのアンドロイドデバイスで動作しますが、iOSでは動作しません！