【】H5 DIV高度变0的问题_html/css_WEB-ITnose

HTML代码如下。
如果去掉第一行的nbsp;HTML>，则下面标红的DIV就能够显示出来。如果加上第一行的nbsp;HTML>，标红的DIV的高度就变成0px了。我原本是想通过百分比设置高度的。但是却出现了这个问题。。。
哪位大侠帮忙看一下。谢谢！
nbsp;html>

        
        
        
        
        
        
        
        
        
        
        

        

    
    
        

Aimee

F

2-28

• 
  

• 
  

• 
  

• 
  

• 
  

评论图标

评论数量100

赞

9999+

回复图标

发射弹幕

    
    <script></script>
    <script></script>
    <script> <br /> appcan.ready(function() { <br /> appcan.initBounce(); <br /> mito(); <br /> }) <br /> function mito() { <br /> var arrData = [{ <br /> "usericon" : "usericon-default", <br /> "username" : "Aimee", <br /> "usergender" : "F", <br /> "date" : "2-28", <br /> "title" : "这是正文，如果超长，需要截断。", <br /> "replynum" : "100", <br /> "supportnum" : "9999+" <br /> }, { <br /> "usericon" : "usericon-default", <br /> "username" : "Daniel", <br /> "usergender" : "M", <br /> "date" : "2-28", <br /> "title" : "这是正文，如果超长，需要截断。哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈", <br /> "replynum" : "100", <br /> "supportnum" : "9999+" <br /> }, { <br /> "usericon" : "usericon-default", <br /> "username" : "Daniel", <br /> "usergender" : "M", <br /> "date" : "2-28", <br /> "title" : "这是正文，如果超长，需要截断。哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈", <br /> "replynum" : "100", <br /> "supportnum" : "9999+" <br /> }, { <br /> "usericon" : "usericon-default", <br /> "username" : "Daniel", <br /> "usergender" : "M", <br /> "date" : "2-28", <br /> "title" : "这是正文，如果超长，需要截断。哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈", <br /> "replynum" : "100", <br /> "supportnum" : "9999+" <br /> }]; <br /> <br /> var tmpl = ' <div class="ub ub-ver ubb bc-border style-container">' <br /> + ' <div class="uinn ub ub-ac ub-pc style-line1">' <br /> + ' <div class="${usericon} ub-img umhw2 umar-a">' <br /> + ' <div class="ub-f1 uinn-mtxt ut-s">${username}' <br /> + ' <div class="ub-f1 uinn-mtxt ut-s">${usergender}' <br /> + ' <div class="ub-img res-arrow umw1 umh1">${date}' <br /> + ' ' <br /> + ' <div class="ulev-app2 bc-text ut-s style-line2">${title}' <br /> + ' <div class="ub ub-ver style-line3" id="arean">Arean' <br /> + ' <div id="J_Roll_Container" class="news-box">' <br /> + ' <ul class="J_Roll_Content news-list" id="li">' <br /> + ' <li>' <br /> + ' ' <br /> + ' ' <br /> + ' ' <br /> + ' <div class="ub ub-f1 c-bad bc-text-head ub-ac uinn-m umar-b style-line4">' <br /> + ' <div class="ub-img res-order umwh-m">评论图标' <br /> + ' <div class="ub-f1 uinn-mtxt ut-s">评论数量${replynum}' <br /> + ' <div class="ub-img res-arrow umw1 umh1">赞' <br /> + ' <div class="ub-img res-arrow umw1 umh1">${supportnum}' <br /> + ' <div class="ub-img res-arrow umw1 umh1">回复图标' <br /> + ' <div class="ub-img res-arrow umw1 umh1">发射弹幕' <br /> + ' ' <br /> + ' '; <br /> var s = appcan.tempRenderList(tmpl, arrData, appcan.getObjLength(arrData)); <br /> var d = document.createElement('DIV'); <br /> d.setAttribute("class", "ub ub-ver uinn-m uof"); <br /> d.innerHTML = s; <br /> $('#mito')[0].appendChild(d); <br /> } <br /> </script>

回复讨论(解决方案)

刚看了下，去掉nbsp;HTML>后，html标签会被自动附加上高度，高度是根据浏览器高度设置的，当你加上nbsp;HTML>后，却不会再html标签中加上高度，而你的内部div全部都是百分比控制，当html标签没有附加高度时，内部的div高度就失去了参照，所以高度就成0了，如果需要解决这个问题只要在body或者html时加上高度就可以了

后来调测了一下，发现是Body中的第二层div：

没有设置height:100%导致的。加上了问题就解决了。谢谢！