Rumah >hujung hadapan web >tutorial css >Bagaimana Memusatkan Elemen Kanak-Kanak Dalam Ibu Bapa `` Menggunakan CSS?
Bagaimana Memusatkan Elemen Kanak-Kanak Dalam Ibu Bapa `` Menggunakan CSS?
- Susan Sarandonasal
- 2024-11-30 11:45:16719semak imbas
Memusatkan Elemen dalam
Apabila menggunakan CSS untuk memusatkan elemen dengan kiri: 50%;, penjajaran adalah relatif kepada keseluruhan tetingkap. Walau bagaimanapun, apabila memusatkan elemen dalam induk
, kami mahu penjajaran adalah relatif kepada elemen yang mengandunginya.
Penyelesaian
Untuk mencapai ini, kita boleh menggunakan gabungan teks -selaraskan: tengah; dan margin: auto; Sifat CSS.
Langkah 1: Jajarkan Induk Pusat
Tetapkan penjajaran teks: tengah; kepada ibu bapa
unsur. Ini akan memusatkan semua elemen anaknya di dalamnya.
Langkah 2: Pusatkan Anak Tertentu Menggunakan Margin
Setelah ibu bapa
adalah sejajar, kita perlu memusatkan elemen kanak-kanak tertentu. Guna margin: auto; kepada elemen kanak-kanak. Ini secara automatik akan memusatkan elemen dalam induk , tanpa mengira lebar elemen anak.
Untuk kejelasan, berikut ialah contoh:
#parent {
text-align: center;
background-color: blue;
height: 400px;
width: 600px;
}
.child {
height: 100px;
width: 200px;
text-align: left;
}
.center {
margin: auto;
background-color: green;
}Atas ialah kandungan terperinci Bagaimana Memusatkan Elemen Kanak-Kanak Dalam Ibu Bapa `` Menggunakan CSS?. 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.cnArtikel sebelumnya：Bagaimanakah Saya Boleh Menukar Warna Latar Belakang Navbar Saya pada Tatal?Artikel seterusnya：Bagaimanakah Saya Boleh Menukar Warna Latar Belakang Navbar Saya pada Tatal?
Apabila menggunakan CSS untuk memusatkan elemen dengan kiri: 50%;, penjajaran adalah relatif kepada keseluruhan tetingkap. Walau bagaimanapun, apabila memusatkan elemen dalam induk
Penyelesaian
Untuk mencapai ini, kita boleh menggunakan gabungan teks -selaraskan: tengah; dan margin: auto; Sifat CSS.
Langkah 1: Jajarkan Induk Tetapkan penjajaran teks: tengah; kepada ibu bapa Langkah 2: Pusatkan Anak Tertentu Menggunakan Margin Setelah ibu bapa Untuk kejelasan, berikut ialah contoh: Atas ialah kandungan terperinci Bagaimana Memusatkan Elemen Kanak-Kanak Dalam Ibu Bapa `` Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!#parent {
text-align: center;
background-color: blue;
height: 400px;
width: 600px;
}
.child {
height: 100px;
width: 200px;
text-align: left;
}
.center {
margin: auto;
background-color: green;
}