Question

嘿伙计，所以我无法弄清楚为什么尺寸没有被改变任何人都可以帮助我？我的理想目标是让第一行为70％，第二行为30％。任何建议将不胜感激

<html>
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px;  margin:0px;">
    <div style='display : table; width : 100%; height : 100%'>

        <div style='display : table-row; width : 100%; height : 10%;'>
            <div style="height:100%; width:100%; border:solid; display : table-cell;">
                blah
            </div>
        </div>

        <div style='display : table-row; width : 100%; height : 50%;'>
            <div style="height:100%; width:100%; border:solid; display : table-cell;">
                hah
            </div>
        </div>

    </div>
</body>
</html>

Answer 1

试试此代码..

示例链接在此处：FIDDLE

HTML CODE ：

<html>
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px;  margin:0px;">
    <div style='display : table; width : 100%; height : 100%'>

        <div style='display : table-row; width : 100%; height : 70%;'>
            <div style="height:70%; width:100%; border:solid; display : table-cell;">
                blah
            </div>
        </div>

        <div style='display : table-row; width : 100%; height : 30%;'>
            <div style="height:30%; width:100%; border:solid; display : table-cell;">
                hah
            </div>
        </div>

    </div>
</body>
</html>

希望此代码对您有所帮助，如果您有任何澄清，请告诉我......

Answer 2

尝试以下内容。

<html>
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px;  margin:0px;">
    <div style='display : table; width : 100%; height : 100%'>

        <div style='display : table-row; width : 100%; height : 10%;'>
            <div style="height:100%; width:70%; border:solid; display : table-cell;">
                blah
            </div>
        </div>

        <div style='display : table-row; width : 100%; height : 50%;'>
            <div style="height:100%; width:30%; border:solid; display : table-cell;">
                hah
            </div>
        </div>

    </div>
</body>
</html>

或以下

<html>
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px;  margin:0px;">
    <div style='display : table; width : 100%; height : 100%'>

        <div style='display : table-row; width : 70%; height : 10%;'>
            <div style="height:100%; width:100%; border:solid; display : table-cell;">
                blah
            </div>
        </div>

        <div style='display : table-row; width : 30%; height : 50%;'>
            <div style="height:100%; width:100%; border:solid; display : table-cell;">
                hah
            </div>
        </div>

    </div>
</body>
</html>

快乐编码

按百分比调整表格行无效

2 个答案: