坑了爹的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上不行。