Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Membetulkan Footer ke Bahagian Bawah Halaman Web?

Bagaimana untuk Membetulkan Footer ke Bahagian Bawah Halaman Web?

DDD
DDDasal
2024-12-16 10:55:17974semak imbas

How to Fix a Footer to the Bottom of a Web Page?

Cara Membetulkan Pengaki ke Bawah Halaman

Banyak tapak web menghadapi isu mempunyai pengaki yang tidak ditetapkan pada bahagian bawah halaman, terutamanya pada halaman dengan jumlah kandungan yang kecil. Untuk memastikan pengaki kekal di bahagian bawah halaman, tanpa mengira saiz skrin atau panjang kandungan, berikut ialah penyelesaian CSS:

#footer {</p>
<pre class="brush:php;toolbar:false">position: fixed;
height: 50px;
background-color: red;
bottom: 0px;
left: 0px;
right: 0px;
margin-bottom: 0px;

}

Kod ini memberikan sifat berikut kepada pengaki:

  • kedudukan: Menetapkan kedudukan pengaki kepada tetap, memastikan ia kekal pada tempatnya tanpa mengira kedudukan tatal halaman.
  • tinggi: Menentukan ketinggian pengaki.
  • warna latar belakang: Laraskan warna latar belakang pengaki untuk tujuan tunjuk cara.
  • bawah: Letakkan tepi bawah pengaki 0 piksel dari bahagian bawah halaman.
  • kiri: Menjajarkan tepi kiri pengaki ke tepi kiri halaman.
  • kanan: Menjajarkan tepi kanan pengaki ke tepi kanan halaman.
  • margin-bawah: Mengalih keluar sebarang jidar bawah yang tidak diingini.

Untuk memastikan kandungan tidak bertindih dengan pengaki tetap, peraturan CSS tambahan boleh digunakan pada elemen badan:

badan {

margin-bottom: 50px;

}

Ini menambah jidar bawah 50 piksel pada badan, mewujudkan ruang untuk pengaki tetap dipaparkan.

Atas ialah kandungan terperinci Bagaimana untuk Membetulkan Footer ke Bahagian Bawah Halaman Web?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn