Bagaimana untuk memusatkan gambar dalam html

HTML (Hypertext Markup Language) ialah salah satu bahasa asas untuk mencipta halaman web. Dalam reka bentuk antara muka web, imej sering digunakan, jadi bagaimana untuk memusatkan imej dalam HTML?

Berikut ialah 3 kaedah, masing-masing dilaksanakan menggunakan CSS, jadual HTML dan teg HTML5.

Kaedah 1: Gunakan CSS untuk memusatkan imej

Anda boleh menggunakan sifat jidar CSS untuk memusatkan imej secara menegak dan mendatar.

Langkah:

1. Sisipkan imej dalam HTML:

<img src="图片路径" alt="图片描述">

2. Tetapkan gaya elemen img dalam fail CSS

img {
  display: block;
  margin: 0 auto;
}

Penjelasan:

• paparan: blok;
• margin: 0 auto digunakan untuk menetapkan jidar imej jika jidar kiri dan kanan ditetapkan kepada automatik, imej akan dipusatkan secara mendatar dalam bekasnya.

Kaedah 2: Gunakan jadual HTML untuk memusatkan imej

Anda boleh menggunakan elemen jadual HTML dan menjajarkan atribut untuk memusatkan imej secara menegak dan mendatar.

Langkah:

1. Buat jadual dalam HTML:

      <img src="图片路径" alt="图片描述">
    

2. Tetapkan atribut penjajaran jadual kepada "tengah":

      <img src="图片路径" alt="图片描述">
    

Penjelasan: Atribut penjajaran dalam elemen

• b6c5a531a458a2e790c1fd6421739d1c digunakan untuk menetapkan penjajaran menegak dan mendatar kandungan dalamannya.
• Jika anda menambah imej pada elemen b6c5a531a458a2e790c1fd6421739d1c dalam elemen e0f397b00902e1f88579775d78d26d4e

Kaedah 3: Gunakan teg HTML5 untuk memusatkan imej

HTML5 memperkenalkan beberapa teg semantik baharu, seperti 23c3de37f2f9ebcb477c4a90aac6fffd, 2f8332c8dcfd5c7dec030a070bf652c3, c787b9a589a3ece771e842a6176cf8e9, < ; pengepala> dan 0ea0fdebfc4744a599932dc18f3592e3 Anda boleh menggunakan teg CSS atau HTML5 untuk memusatkan imej secara menegak dan mendatar.

Langkah:

1. Gunakan teg 24203f2f45e6606542ba09fd2181843a dan 614eb9dc63b3fb809437a716aa228d24 dalam HTML untuk mencipta imej:

  <img src="图片路径" alt="图片描述">
  
图片标题

2. dalam CSS Tetapkan gaya teg db86f9cf24d925f483a827a550ce1f70 dan 5811a0e55f5c071c3af8b2b3e8fe348d blok imej, kapsyen boleh ditambahkan pada elemen 614eb9dc63b3fb809437a716aa228d24

Helaian gaya CSS memberitahu penyemak imbas untuk menjadikan elemen 03dc3c22ec33186f2ad8f3f3b172508a

Ringkasan
• Melalui CSS, jadual HTML dan teg HTML5, kami boleh mencapai kesan pemusatan menegak dan mendatar imej dalam reka bentuk web. Anda boleh memilih kaedah yang paling sesuai dengan anda mengikut situasi sebenar.

Atas ialah kandungan terperinci Bagaimana untuk memusatkan gambar dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!