Rumah > hujung hadapan web > tutorial css > Mengapa Elemen Kedudukan Saya Tidak Sesuai Di Tempat yang Saya Jangkakan?

Mengapa Elemen Kedudukan Saya Tidak Sesuai Di Tempat yang Saya Jangkakan?

Barbara Streisand
Lepaskan: 2024-12-11 04:25:17
asal
893 orang telah melayarinya

Why Isn't My Absolutely Positioned Element Where I Expect It?

Isu Kedudukan Mutlak Selesai

Elemen tertentu mungkin tidak mematuhi garis panduan kedudukan mutlak. Ini boleh mengecewakan, kerana elemen mungkin muncul di lokasi yang tidak dijangka, seperti penjuru kiri sebelah atas halaman.

Pengenalpastian Masalah

Percubaan kod yang disediakan untuk meletakkan elemen dengan ID 'absPos' sepenuhnya dalam div induknya. Walau bagaimanapun, tetapan CSS nampaknya tidak berkesan.

Contoh Kod

...
<div>
Salin selepas log masuk
Salin selepas log masuk

Penyelesaian

Dalam senario ini, cabarannya terletak pada ketiadaan elemen kedudukan di antara nod induk 'absPos'. Akibatnya, elemen menggunakan elemen badan sebagai offsetParent, yang bukan elemen kedudukan.

Penyelesaiannya ialah menggunakan 'kedudukan: relatif' kepada div induk. Ini menjadikan induk menjadi elemen yang diposisikan, menjadikannya sebagai offsetParent untuk elemen anaknya 'absPos'.

Sampel Kod Disemak

...
<div>
Salin selepas log masuk
Salin selepas log masuk

Pelarasan ini memastikan bahawa elemen 'absPos' mematuhi kedudukan mutlaknya yang ditentukan, kerana ia kini relatif kepada kedudukannya ibu bapa.

Atas ialah kandungan terperinci Mengapa Elemen Kedudukan Saya Tidak Sesuai Di Tempat yang Saya Jangkakan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan