Bagaimana Membuat DIV Mengisi Keseluruhan Ketinggian Halaman Walaupun Kosong?

Cara Memaksa Blok DIV Mengisi Halaman Secara Menegak Walaupun Tanpa Kandungan

Dalam situasi tertentu, anda mungkin menghadapi senario yang anda perlukan blok DIV untuk dilanjutkan ke bahagian bawah halaman tanpa mengira kandungannya. Begini cara anda boleh mencapai ini:

Masalahnya:

Apabila blok DIV tidak mempunyai kandungan, ia biasanya runtuh untuk menduduki hanya ruang menegak yang diperlukan untuk sempadannya dan padding. Akibatnya, ia mungkin tidak sampai ke bahagian bawah halaman, meninggalkan ruang kosong.

Penyelesaian:

Untuk memaksa blok DIV mengisi halaman secara menegak , atasi perkara berikut:

1. Ketinggian Elemen Bekas: Jika elemen bekas mengelilingi DIV blok, seperti badan atau div induk, tidak mempunyai ketinggian ditetapkan kepada 100%, blok DIV di dalamnya tidak boleh melebihi ketinggian bekas. Oleh itu, tetapkan ketinggian: 100%; harta untuk kedua-dua HTML dan elemen badan:

html, body {
  height: 100%;
}

2. Jing dan Padding: Pastikan tiada jidar tambahan atau padding ditambahkan pada blok DIV atau bloknya bekas yang akan menghalangnya daripada memanjang sepenuhnya.

Dengan mengikuti langkah-langkah ini, blok DIV kini akan memanjang ke bahagian bawah halaman, walaupun ia tidak mempunyai kandungan. Walau bagaimanapun, ambil perhatian bahawa keserasian penyemak imbas dan Mod Quirks mungkin menjejaskan hasil akhir, jadi rujuk sumber seperti quirksmode.org untuk pelarasan lanjut.

Atas ialah kandungan terperinci Bagaimana Membuat DIV Mengisi Keseluruhan Ketinggian Halaman Walaupun Kosong?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!