Kuvan kiertäminen verkkosivulla on mahdollista käyttämällä CSS-koodia kääntävän luokan luomiseksi, jota voit sitten käyttää tunniste, jos haluat kiertää kuvaa sivulla.

Kuvan kääntäminen käyttämällä

CSS-koodin on sisällettävä muunnosten koodi jokaiselle suurelle Internet-selaimelle, jotta kuva pyörii kaikissa selaimissa.

Alla on esimerkki CSS-koodista kuvan kääntämiseksi 180 astetta.

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

Kun CSS-koodi on sovellettu .css-tiedostoon tai tyylitaulukkoon, voit käyttää CSS-luokan nimeä missä tahansa kuvamerkinnässä alla olevan koodin mukaisesti.

Vihje: Jos haluat kiertää kuvaa toisella asteella, muuta "180" CSS-koodissa ja tunniste haluamallesi tasolle.

Käännetty kuva yllä olevaa koodia käyttäen

Alla on esimerkki edellä mainittua koodia käyttävästä logostasi, jos selaimesi tukee CSS-kiertoa, logo näyttää kääntyvän 180 astetta.