Cara memutar gambar dengan CSS dan HTML

Memutar gambar pada halaman web dimungkinkan dengan menggunakan kode CSS untuk membuat kelas rotate, yang kemudian dapat Anda gunakan dengan tag untuk memutar gambar pada halaman.

Memutar gambar menggunakan

Kode CSS perlu menyertakan kode transformasi untuk setiap browser Internet utama, sehingga gambar diputar di semua browser.

Di bawah ini adalah contoh kode CSS untuk memutar gambar 180 derajat.

 .rotateimg180 {-webkit-transform: rotate (180deg); -moz-transform: rotate (180deg); -ms-transform: rotate (180deg); -o-transform: rotate (180deg); transform: rotate (180deg); } 

Setelah kode CSS diterapkan pada file .css atau stylesheet Anda, Anda dapat menggunakan nama kelas CSS di salah satu tag gambar Anda seperti yang ditunjukkan dalam kode di bawah ini.

Tip: Untuk memutar gambar dengan ukuran derajat lain, ubah "180" pada kode CSS dan tag ke tingkat yang Anda inginkan.

Gambar yang diputar menggunakan kode di atas

Di bawah ini adalah contoh dari logo kami menggunakan kode di atas, jika browser Anda mendukung rotasi CSS, logo akan tampak diputar 180 derajat.