Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Mengekalkan Nisbah Aspek Apabila Mengubah Saiz Imej dengan CSS?

Bagaimanakah Saya Boleh Mengekalkan Nisbah Aspek Apabila Mengubah Saiz Imej dengan CSS?

Susan Sarandon
Lepaskan: 2024-12-21 16:29:10
asal
728 orang telah melayarinya

How Can I Maintain Aspect Ratio When Resizing Images with CSS?

Memelihara Nisbah Aspek Semasa Saiz Semula Imej

Membetulkan percanggahan nisbah aspek dalam saiz semula imej boleh dicapai melalui pengubahsuaian CSS.

Kod HTML pada asalnya menentukan kedua-dua atribut lebar dan ketinggian untuk imej, yang mengatasi CSS peraturan. Untuk membenarkan CSS diutamakan, atribut ketinggian hendaklah dialih keluar.

Selain itu, sifat lebar maksimum dalam peraturan CSS mengehadkan lebar imej. Walau bagaimanapun, ketinggian tidak ditetapkan secara eksplisit. Untuk memastikan nisbah bidang dikekalkan, ketinggian juga harus dihadkan, tetapi dengan cara yang menghormati nisbah bidang asal.

Coretan yang disediakan mencadangkan penggunaan ciri CSS paparan: blok, lebar maksimum: 230px, maks -tinggi: 95px, lebar: auto, dan tinggi: auto. Tetapan ini membenarkan imej berkembang dalam kekangan lebar maks dan ketinggian maks sambil mengekalkan nisbah aspek asalnya. Oleh itu, imej akan mengubah saiz tanpa herotan atau pemangkasan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengekalkan Nisbah Aspek Apabila Mengubah Saiz Imej dengan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan