事业部被渲染为空

我有一个页面，看起来像这样：事业部被渲染为空

<html> 
    <body> 
     <div id="outer"> 
      <div id="inner"> 
       <img width="300" height="250" src="someimage.jpg"/> 
      </div> 
     </div> 
    </body> 
</html>

的CSS样式是这样的：

*{ 
    margin:0px; 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    -webkit-user-select: none; 
    -webkit-touch-callout: none; 
} 

body { 
    width:100%; 
    height:100%; 
    background:red; 
    overflow:hidden; 
} 

#outer { 
    position:absolute; 
    top:0px; 
    left:0px; 
    width:100%; 
    height:100%; 
    display:-webkit-box; 
    -webkit-box-orient:horizontal; 
    -webkit-box-pack:center; 
    -webkit-box-align:center; 
    overflow:hidden; 
    border: 1px solid blue; 
}

我得到了很多奇怪的行为：

在WebView的网页的初始加载中，我看到的只是一条蓝线。这就像是inner div中没有图像。
在第一次刷新时，WebView将缓慢扩展至100％的高度。它缓缓显露出someimage.jpg。这就像outer div的动画，因为它慢慢意识到它需要占据整个屏幕。
在所有后续刷新中，扩展动画不会发生。一切都很美好。

在网页的前两个负载中发生了什么？

另一个奇怪的是，如果我没有蓝色边框，＃2和＃3不会发生。也就是说，我坚持只是一个蓝色的线条，这是一个折叠的div的蓝色边框。我不明白为什么我需要边框才能使inner div的内容显示出来。

请注意，我对所有负载使用相同的WebView。也就是说，只需拨打WebView#loadUrl即可。

来源

2013-03-04 user5243421

我想到它为什么“扩大”它的方式：我没有添加任何布局参数的WebView！看来，我所有的问题都源于这个小细节。

来源

2013-03-04 05:52:52 user5243421

事业部被渲染为空

回答

相关问题