Sådan roteres et billede med CSS og HTML

At rotere et billede på en webside er muligt ved brug af CSS-kode til at oprette en roterende klasse, som du derefter kan bruge med tag for at rotere billedet på siden.

Rotere et billede ved hjælp af

CSS-koden skal indeholde transformationskode for hver større internetbrowser, så billedet roteres i alle browsere.

Nedenfor er et eksempel på CSS kode til at rotere et billede 180 grader.

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

Når CSS-koden er blevet anvendt til din .css-fil eller dit stylesheet, kan du bruge CSS-klassenavnet i nogen af ​​dine billedkoder som vist i nedenstående kode.

Tip: For at rotere et billede med en anden grad af grader, skal du ændre "180" i CSS-koden og tag i den grad du ønsker.

Roteret billede ved hjælp af ovenstående kode

Nedenfor er et eksempel på vores logo ved hjælp af ovenstående kode, hvis din browser understøtter CSS rotation, skal logoet blive roteret 180 grader.