masyarakat

Belajar

Perpustakaan Alatan

Alat AI

Masa lapang

Melayu

Rumah > hujung hadapan web > tutorial css > Galeri dengan saiz imej yang berbeza-beza menggunakan nisbah aspek dan muat objek

Galeri dengan saiz imej yang berbeza-beza menggunakan nisbah aspek dan muat objek

Patricia Arquette

Lepaskan： 2025-01-08 18:09:41

asal

788 orang telah melayarinya

Gallery with varied image sizes using aspect-ratio and object-fit

Kod ini mencipta galeri imej bersih yang mengandungi imej bersaiz berbeza, semuanya mengekalkan nisbah bidang 3:2.

Lihat demo Codepen:

Artikel penuh: Buat galeri imej dengan saiz yang berbeza menggunakan nisbah aspek dan muat objek
Coretan kod CSS

Atas ialah kandungan terperinci Galeri dengan saiz imej yang berbeza-beza menggunakan nisbah aspek dan muat objek. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Meningkatkan Pengalaman Pengguna Borang dengan CSS: Teknik Maklum Balas Masa Nyata untuk Interaksi Pengguna yang Lebih Baik Artikel seterusnya：Menavigasi Alam Semula Jadi: Bagaimana Teknologi Boleh Meningkatkan Pengembaraan Luaran Anda

Kenyataan Laman Web ini

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

Artikel terbaru oleh pengarang

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

2433

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

2564

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

2169

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...