Bagaimana untuk membuat div menduduki baki ketinggian halaman?

Mencapai Pekerjaan Ketinggian Div Optimum

Apabila bekerja dengan reka letak web, selalunya perlu mempunyai div yang menduduki baki ketinggian halaman. Ambil kes berikut: dua div, satu dengan ketinggian tetap dan satu lagi bertujuan untuk mengisi ruang yang tinggal.

<div>

Untuk memastikan div2 menduduki baki ketinggian halaman, penyelesaian yang berkesan adalah dengan menggunakan kedudukan mutlak:

#div1 {
    width: 100%;
    height: 50px;
    background-color: red; /* Development Only */
}
#div2 {
    width: 100%;
    position: absolute;
    top: 50px;
    bottom: 0;
    background-color: blue; /* Development Only */
}

Dengan pendekatan ini, div1 mengekalkan ketinggian tetapnya, manakala div2 diletakkan secara mutlak, bermula dari bahagian bawah div1 dan menduduki baki ruang menegak sehingga bahagian bawah halaman, dengan berkesan mengisi ketinggian yang tinggal.

Atas ialah kandungan terperinci Bagaimana untuk membuat div menduduki baki ketinggian halaman?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!