【】H5 DIVの高さが0になる問題_html/css_WEB-ITnose

HTMLコードは以下の通りです。
1行目のを削除すると、以下の赤枠のDIVが表示されます。 1行目にを追加すると赤いDIVの高さが0pxになります。もともと高さをパーセンテージで設定したいと思っていました。しかし、この問題が発生しました。 。 。
誰かヒーローを見て手伝ってくれませんか?ありがとう！
;title> =1、ユーザー スケーラブル = いいえ、最小スケール = 1.0、最大スケール = 1.0">
スタイルシート" href="css/ui-color.css">
/ appcan.control.css">
rel="stylesheet" href="main_content/css/main.css">
rel="stylesheet" href="css/usericons.css"> & & Lt; ボディ {font: 12px/1.5 tahoma, "Microsoft Yahei E8F6F96C59ed1";} .style-main {マージン: 0; 幅: 100%; 高さ: 100%; オーバーフロー: 相対;
.style-containerパディング: 0; 幅: 100%; 背景色: #fcfcfd; 位置: 相対;
.style-line1 {マージン: 0;幅: 100%; 高さ: 20%; 背景色: #fcfcfd; 位置: 相対;
.style-line2 {幅: 0%; 高さ: 10%;背景色: #fcfcfd; 位置: 相対;
.style-line3 {幅: 100%; 背景色: #fcfcfd; ; 位置: 相対;} .style-line4 {パディング: 0; 幅: 100%; 高さ: 20%;
位置: 相対マージン: 0; }
.news ul { リストスタイル: なし }
.news-area { マージン: 0; 高さ: 100%;非表示; 位置: 相対;         .news-box { margin:0; padding: 0; width: 100%; height: 20%; background-color: #fcfcfd; overflow: hidden; position: relative; font-size: 2vh;} 
        .news-interval { margin:0; padding: 0; width: 100%; height: 5%; background-color: #fcfcfd; overflow: hidden; position: relative; }
        .news h1 { margin-bottom: 15px; padding-left: 20px; color: #370188; } 
        .news-list { position: absolute; } 
        .news-list li { width: 100%; height: 100%; line-height: 100%; overflow: hidden; word-wrap: normal; font-size: 1em;} 
        .news-list li a { text-decoration: none; color: #000; } 
        .news-list li a:hover { 
        -webkit-transition: color .2s linear, background-color .3s linear; 
        -moz-transition: color .2s linear, background-color .3s linear; 
        -ms-transition: color .2s linear, background-color .3s linear; 
        -o-transition: color .2s linear, background-color .3s linear; 
        transition: color .2s linear, background-color .3s linear; 
        color: #FF4400; 
        text-decoration: underline; 
        } 
        .news-list li a:visited { color: #290065; }
        

    
    
        

Aimee

F

2-28

评论图标

评论数量100

赞

9999+

回复图标

发射弹幕

& gt; .ready (function () {
appcan.initboundce ();
mito ();

function mito () {
var arrdata = [{
" usericon": "" "" "" ":" "" "" Usericon-Default " 、
"username": "Aimee"、
"usergender": "F"、
"date": "2-28"、
"title": "これが本文です。長すぎる場合は切り詰める必要があります。"、
"replynum" : "100"、
"supportnum" : "9999+"
" "usericon" : "usericon-default"、
"username" : "Daniel"、
"usergender" : "M"、
"date" : "2-28"、
"title" : "これが本文です。長すぎるため、切り詰める必要があります。Hahahahahahahahahahahaha"、
"replynum" : "100" 、
"supportnum " : "9999+" 「usergender」 : "M"、
"date" : 「2-28」、
"title": "これが本文です。長すぎる場合は切り詰める必要があります。ははははははははははははははははははは",
"replynum" : "100",
"supportnum" : "9999+"
}, {
"usericon" : "usericon-default",
                "username" : "Daniel",
                "usergender" : "M",
                "date" : "2-28",
                "title" : "这是正文，如果超长，需要截断。哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈", 
                "replynum" : "100",
                "supportnum" : "9999+" 
            }];

            var tmpl = ' 

' 
                        + '     

'
                        + '         

'
                        + '         

${username}

'
                        + '         

${usergender}

'
                        + '         

${date}

'
                        + '     

'
                        + '     

${title}

'
                        + '     

Arean'
                        + '         

' 
                        + '             

'
                        + '                 
'
                        + '             

'
                        + '         

'
                        + '     

'
                        + '     

'
                        + '         

评论图标

'
                        + '         

评论数量${replynum}

'
                        + '         

赞

'
                        + '         

${supportnum}

'
                        + '         

回复图标

'
                        + '         

发射弹幕

'
                        + '     

'
                        + ' 

';
var s = appcan.tempRenderList(tmpl, arrData, appcan.getObjLength(arrData));
var d = document.createElement('DIV'); uinn-m uof");
d.innerHTML = s;
gt;

ディスカッションへの返信 (解決策)

調べてみたところ、 を削除した後、html タグが削除されていることがわかりました。 を追加すると、高さが自動的に追加され、すべての内部 div がパーセンテージで制御されます。 HTML タグに高さが付加されていない場合、内部 div の高さは参照を失うため、高さは 0 になります。必要に応じて、この問題を解決するには、本文または HTML に高さを追加するだけです

, Body の div の 2 番目の層であることがわかりました:

height:100% を設定していないことが原因です。それを追加すると問題が解決しました。ありがとう！