坑了爹的Android webview中的height：100%
阿新 • • 發佈：2019-01-03
最近在做一個東西，一個loading頁面，非常簡單，只需把一個gif圖片水平+垂直居中即可。
demo的程式碼如下：
<style type="text/css"> *{ padding: 0px; margin: 0px; border: 0px; } html{ height: 100%; } body { position: relative; height: 100%; width:100%; background: #fff; font-family: "微軟雅黑", Helvetica, Arial, sans-serif; font-size: 100%; background-color: #f2f2f2; } .ready{ position: relative; width: 100%; height: 100%; text-align: center; } .load{ position: absolute; width: 120px; height: 120px; left: 50%; top: 50%; margin-top : -60px; margin-left: -60px; } .load > img{ width: 100%; } </style> </head> <body> <div class="ready"> <div class="load"> <img src="/static/images/pk/star_wrong.png"> <p>努力載入中</p> </div> </div> </body>
在手機端和PC的瀏覽器，以及各種微信，QQ，我們iOS版APP開啟的樣子都是對的，也就是下面這個樣子：
但是，在我們Android版的APP中，它是下面這樣：
個人感覺很顯然是外層class=ready的div的高度100%沒有效果，調了半天也沒招，求大神賜教。
ps：把div的高度設成絕對高度是可以的，例如height:640px,這時候這個div是撐開的，但為啥100%不行，別的什麼都行就自己app上不行。