Mengapa Imej Saya dalam Tag Anchor Menunjukkan Ruang Putih Tambahan Di Bawah?

Cabaran Ruang Putih di Bawah Teg Sauh

Anda telah menghadapi masalah ruang putih yang membingungkan di mana tag sauh yang mengandungi imej kelihatan lebih tinggi sedikit daripada kandungannya. Walaupun menetapkan kedua-dua jidar dan padding kepada sifar, jurang tiga piksel muncul di bawah imej. Percanggahan ini mengganggu penjajaran visual yang dimaksudkan dalam sempadan div sekeliling.

Memahami Punca

Masalahnya terletak pada pemformatan CSS. Secara lalai, imej dipaparkan sebaris, menyerupai aksara teks pada garis dasar bertulis. Malangnya, peletakan ini termasuk ruang putih tambahan yang dikhaskan untuk aksara turun (cth., j, g, y, p).

Menyelesaikan Ruang Putih

Untuk membetulkan isu ini, laraskan penjajaran menegak menggunakan CSS:

img {
  vertical-align: bottom;
}

Dengan menetapkan penjajaran menegak: bawah, anda menjajarkan imej ke bahagian bawah baris teks, dengan berkesan menghapuskan jurang ruang putih. Kini, imej dan jidar anda akan dijajarkan dengan lancar, mencapai kesan visual yang anda inginkan.

Atas ialah kandungan terperinci Mengapa Imej Saya dalam Tag Anchor Menunjukkan Ruang Putih Tambahan Di Bawah?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!