Mengapa Div Saya Tidak Bergerak?

Linda Hamilton

Lepaskan： 2024-11-30 03:48:14

asal

628 orang telah melayarinya

Why Isn't My Absolutely Positioned Div Moving?

Kedudukan Mutlak Tidak Berfungsi

Dalam percubaan untuk meletakkan div dengan ID "absPos" secara mutlak dalam div induknya, pembangun menemui isu di mana div kekal di bahagian atas sebelah kiri halaman sudut.

Penjelasan:

Elemen dengan kedudukan mutlak disesarkan berdasarkan offsetParentnya, iaitu nenek moyang kedudukan terdekat. Dalam kod sampel yang disediakan, tiada nenek moyang mempunyai elemen "diposisikan", menyebabkan div diimbangi daripada elemen badan, offsetParentnya.

Penyelesaian:

Untuk membetulkan isu ini, position:relative harus digunakan pada div induk. Ini mengubahnya menjadi elemen diposisikan dan menetapkannya sebagai offsetParent untuk anaknya.

Kod Diubah Suai:

<html>
    <body>
        <div>

Salin selepas log masuk

Atas ialah kandungan terperinci Mengapa Div Saya Tidak Bergerak?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimanakah Saya Boleh Memasukkan Teks Secara Dinamik ke Halaman Web Menggunakan CSS atau JavaScript? Artikel seterusnya：Bagaimana :has() Pseudo-Class Menghapuskan Keperluan untuk Hacks JavaScript dalam CSS

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

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

2044

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

2203

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

1861

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...