Rumah > Artikel > hujung hadapan web > Bagaimana Membuat Regangan Div CSS 100% Ketinggian Halaman, Termasuk Kawasan Ditatal?
Meregangkan Div CSS kepada 100% Ketinggian Halaman
Memerlukan penyelesaian CSS untuk meregangkan div untuk merangkumi keseluruhan ketinggian halaman, termasuk kawasan yang ditatal, soalan ini mencari pendekatan HTML/CSS untuk mencapai kesan ini.
Penyelesaian yang dibentangkan melibatkan mengalih keluar sifat CSS tertentu:
Selain itu, CSS berikut disediakan:
<code class="css">html { min-height: 100%; position: relative; } body { height: 100%; } #cloud-container { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; z-index: -1; /* Remove for non-background uses */ }</code>
Apabila dilaksanakan bersama HTML berikut:
<code class="html"><!doctype html> <html> <body> <div id="cloud-container"></div> </body> </html></code>
Penyelesaian ini memastikan bahawa # div bekas awan menduduki ketinggian penuh halaman, termasuk kawasan yang ditatal. Penjelasan yang diberikan menyerlahkan peranan ciri ketinggian min dan kedudukan HTML, serta cara indeks-z, kiri/kanan dan atas/bawah boleh dilaraskan untuk mencapai hasil yang diingini.
Atas ialah kandungan terperinci Bagaimana Membuat Regangan Div CSS 100% Ketinggian Halaman, Termasuk Kawasan Ditatal?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!