Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Menghapuskan Ruang Putih Antara Imej Menggunakan CSS?

Bagaimana untuk Menghapuskan Ruang Putih Antara Imej Menggunakan CSS?

DDD
DDDasal
2024-11-03 20:31:29364semak imbas

How to Eliminate Whitespace Between Images Using CSS?

Menghapuskan Ruang Putih Antara Imej Menggunakan CSS

Apabila memaparkan berbilang imej berturut-turut dalam HTML, anda mungkin menghadapi ruang putih yang tidak diingini yang memisahkannya. Jurang ini timbul disebabkan oleh gelagat sebaris lalai penyemak imbas, yang menganggap ruang, baris baharu dan tab sebagai ruang putih tunggal apabila memaparkan kandungan.

Untuk menghapuskan ruang putih ini dengan berkesan menggunakan CSS, pertimbangkan untuk menetapkan sifat paparan bagi imej anda untuk disekat. Pengubahsuaian ini memaksa imej untuk menduduki satu baris penuh, sekali gus mengalih keluar sebarang ruang kosong sebelum atau di belakang:

<div class="nospace">
    <img src="image1.jpg" style="display: block;" />
    <img src="image2.jpg" style="display: block;" />
</div>

Dengan menggunakan "paparan: blok;" peraturan gaya pada imej anda, anda memastikan bahawa ia berkelakuan sebagai elemen peringkat blok, mengisi keseluruhan lebar yang tersedia dan disusun di atas satu sama lain. Pendekatan ini secara berkesan mengalih keluar sebarang kemungkinan ruang kosong di antara mereka.

Atas ialah kandungan terperinci Bagaimana untuk Menghapuskan Ruang Putih Antara Imej 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.cn