


Mengapa pengaki 'kedudukan: melekit' saya tidak berfungsi apabila saya mentakrifkan sifat 'ketinggian'?
Nov 11, 2024 am 09:50 AM'kedudukan: melekit' tidak berfungsi apabila 'tinggi' ditakrifkan
Apabila menggunakan CSS untuk mencipta pengepala melekit, adalah perkara biasa untuk tetapkan sifat ketinggian div pengaki. Walau bagaimanapun, ini kadangkala boleh menyebabkan gelagat melekit gagal.
Sebabnya ialah kedudukan melekit bergantung pada blok yang mengandungi untuk menentukan titik melekat. Apabila sifat ketinggian ditakrifkan pada div pengaki, ia menjadi blok yang mengandungi. Akibatnya, div pengaki sudah berada di tepi blok yang mengandunginya dan tiada lagi ambang untuk dilalui untuk mencetuskan gelagat melekit.
Untuk menyelesaikan isu ini, alih keluar sifat ketinggian daripada div pengaki. Ini akan membolehkan badan menjadi blok yang mengandungi dan div pengaki akan dapat melekat pada bahagian bawah halaman seperti yang dimaksudkan.
Berikut ialah contoh bagaimana CSS boleh diubah suai untuk membetulkan lekit tingkah laku:
html, body { height: 100%; margin: 0; } #main { height: 92vh; } #landing { display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; } #landingContent { width: 20vw; } #footerNav { display: flex; align-items: center; position: -webkit-sticky; position: sticky; top: 0px; }
Dengan perubahan ini, div pengaki kini akan melekat pada bahagian bawah halaman seperti yang dimaksudkan.
Atas ialah kandungan terperinci Mengapa pengaki 'kedudukan: melekit' saya tidak berfungsi apabila saya mentakrifkan sifat 'ketinggian'?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Menambah bayang -bayang kotak ke blok dan elemen WordPress

Buat borang hubungan JavaScript dengan rangka kerja pintar

Buat editor teks sebaris dengan atribut yang boleh dipertikaikan

Menjadikan Peralihan Svelte Khas pertama anda

Muat naik fail dengan multer di node.js dan ekspres

Membandingkan 5 Pembina Borang PHP Terbaik (dan 3 skrip percuma)
