Rumah > hujung hadapan web > tutorial css > Mengapakah Atribut CSS Saya 'kiri' Tidak Memusatkan Elemen Saya?

Mengapakah Atribut CSS Saya 'kiri' Tidak Memusatkan Elemen Saya?

Susan Sarandon
Lepaskan: 2024-11-14 09:25:02
asal
437 orang telah melayarinya

Why Is My CSS

Atribut "kiri" CSS Tidak Berfungsi

Dalam CSS, sifat "kiri" digunakan untuk mengawal kedudukan mendatar elemen berbanding dengan elemen yang mengandunginya. Walau bagaimanapun, adalah penting untuk memastikan bahawa elemen yang mengandungi mempunyai lebar, ketinggian dan kedudukan yang ditentukan untuk sifat "kiri" berfungsi dengan betul.

Merujuk kepada contoh kod yang anda berikan, anda cuba meletakkan kedudukan kanak-kanak div ("dalam") dalam div induk ("luar") supaya tepi kirinya sejajar dengan tengah div induk menggunakan "kiri: 50%". Walau bagaimanapun, kod yang anda berikan tidak menjajarkan div kanak-kanak dengan betul.

Pembetulan:

Untuk meletakkan div kanak-kanak dengan betul, anda perlu menentukan kedudukan selain daripada "statik" untuk div yang mengandungi ("outther"). Ini kerana kedudukan "statik" ialah nilai lalai untuk elemen dalam HTML dan tidak membenarkan kedudukan yang tepat.

Kod Dilaraskan:

#outher {
   width: 1000px;
   height: 1000px;
   background-color: #ccc;
   position: relative; // Add this line
}

#inner {
   width: 400px;
   height: 300px;
   background-color: #090;
   position: absolute; // Add this line
   left: 50%;
}
Salin selepas log masuk

Dengan menetapkan sifat "kedudukan" kepada "mutlak" untuk div anak dan "relatif" untuk div yang mengandungi, anda mewujudkan titik rujukan yang betul untuk sifat "kiri". Ini memastikan bahawa div anak diposisikan secara relatif kepada div yang mengandungi, dan tepi kirinya sejajar dengan tengah div induk seperti yang dimaksudkan.

Atas ialah kandungan terperinci Mengapakah Atribut CSS Saya 'kiri' Tidak Memusatkan Elemen Saya?. 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