Bagaimanakah Saya Boleh Membuat Semua Imej Saya 100x100 Piksel Menggunakan CSS?

Memaparkan Imej dengan Dimensi Seragam Menggunakan CSS

Membuat galeri imej dengan penampilan yang konsisten boleh menjadi mencabar apabila berurusan dengan imej pelbagai dimensi. Begini cara menggunakan CSS untuk menjadikannya seragam, khususnya menyasarkan saiz 100 x 100 piksel:

Penyelesaian:

Laksanakan kod CSS berikut untuk mencapai hasil yang anda inginkan :

img {
    float: left;
    width:  100px;
    height: 100px;
    object-fit: cover;
}

Tambahkan kod ini pada HTML anda dalam teg atau sebagai gaya sebaris untuk mempengaruhi semua imej.

<img src="image1.jpg" alt="Image 1">
<img src="image2.jpg" alt="Image 2">
<img src="image3.jpg" alt="Image 3">

Penjelasan:

• apung: kiri; menjajarkan imej secara mendatar.
• lebar: 100px; dan ketinggian: 100px; tetapkan dimensi imej kepada 100 piksel dalam kedua-dua arah.
• sesuai objek: penutup; memastikan bahawa imej diubah saiz agar muat sepenuhnya dalam dimensi yang ditentukan. Ini mengekalkan nisbah bidang dan menghalang herotan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Membuat Semua Imej Saya 100x100 Piksel Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!