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
Susan Sarandonasal
2024-11-14 09:25:02472semak imbas

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%;
}

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!

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