0

目的は、( divRestOfHeight )というテーブル内に 2 番目の div を設定して、画面の残りの高さを取得することです。「height:100%; position absolute」でそれを実行しようとしましたが、画面のすべての高さでその div を設定し、休むだけでなく…

javascript の例を見たことがありますが、css だけで行う方法があるかどうか知りたいです。

意見：

<div id="divMain">
    <div>
        <table id="tTable">
                <tr>
                    <td>                            
                        <div id="divFixedHeight" style="height:200px;background-color: red;width: 100%;position: absolute;">

                        </div>
                    </td>
                </tr>            
                <tr>
                    <td>                        
                        <div id="divRestOfHeight" style="background-color:pink">                    

                        </div>
                    </td>
                </tr>
            </table>

    </div>
</div>
4

3 に答える 3

1

ブロック要素を画面の 100% の高さに設定するには、そのすべての親の高さも 100% の高さに設定する必要があります。

たとえば、次のものがあるとします。

<div class="parent">
   <div class="child">
       some content
   </div>
</div>

高さを 100%にするに.childは、高さも 100%.parentに設定する必要があります。そのようです：

html,
body,
.parent,
.child { height: 100%; }
于 2013-02-25T16:19:26.390 に答える
1

このコードは、あなたが求めていることを行います

<body style="padding: 0; margin: 0;">
  <div id="divMain" style="height: 100%;">                          
    <div id="divFixedHeight" style="height:200px;background-color: red;width: 100%;position: absolute;"></div>                      
    <div id="divRestOfHeight" style="background-color:green; height: 100%;"></div>
  </div>
</body>

それとも、それらのテーブルが本当に必要ですか? それは確かに醜いHTMLのように見えます:/

于 2013-02-25T15:56:29.343 に答える
1

divMain の外に出てブラウザ ウィンドウの一番下まで広げたいということですか、それとも divMain 内の残りのスペースを埋めたいということですか?

私の知る限り、ページを埋めない場合、divタグに埋め込まれている間、ブラウザの残りの部分は埋められません。

divMain の高さを増やすか、下の余白を 0px にして伸ばしてみてください。

于 2013-02-25T15:32:52.000 に答える