Slik roterer du et bilde med CSS og HTML

Rotering av et bilde på en nettside er mulig ved bruk av CSS-kode for å lage en roterende klasse, som du deretter kan bruke med tag for å rotere bildet på siden.

Rotere et bilde ved hjelp av

CSS-koden må inkludere transformasjonskode for hver større nettleser, slik at bildet roteres i alle nettlesere.

Nedenfor er et eksempel på CSS-kode for å rotere et bilde 180 grader.

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

Når CSS-koden er brukt på din .css-fil eller stilarket, kan du bruke CSS-klassenavnet i noen av bildekodene dine, som vist i underkoden.

Tips: For å rotere et bilde med et annet grad må du endre "180" i CSS-koden og tag i den grad du ønsker.

Rotert bilde ved hjelp av overkoden

Nedenfor er et eksempel på logoen vår ved hjelp av koden ovenfor, hvis nettleseren din støtter CSS-rotasjonen, vil logoen synes å bli rotert 180 grader.