Bagaimana untuk Memusatkan Imej Secara Mendatar dan Menegak dalam Div?

Menjajarkan Imej di Tengah dan Tengah Div

Dalam reka bentuk web, mencapai penjajaran elemen yang tepat adalah penting untuk antara muka pengguna yang digilap dan menarik secara visual. Satu cabaran biasa ialah menjajarkan imej dalam bekas div supaya ia berpusat secara mendatar dan menegak.

Untuk menangani perkara ini, pertimbangkan struktur div berikut:

<div>

Untuk menjajarkan imej dalam bahagian tengah div, kita boleh menggunakan sifat CSS:

body {
  margin: 0;
}

#over img {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

Dengan menetapkan margin-left: auto; dan margin-right: auto;, kami mengarahkan penyemak imbas untuk melaraskan secara automatik jidar mendatar imej untuk memastikan ia berpusat di dalam div. Selain itu, paparan tetapan: blok; membenarkan imej untuk menduduki barisnya sendiri dan dengan itu dipusatkan secara menegak.

Dengan sifat CSS ini diletakkan, imej anda akan dijajarkan dengan tepat di tengah dan tengah bekas div, tanpa mengira saiz skrin atau div.

Atas ialah kandungan terperinci Bagaimana untuk Memusatkan Imej Secara Mendatar dan Menegak dalam Div?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!