75 views
How to Rotate Image in Html
To rotate an image in HTML, you can use CSS transforms. Here’s an example of how to rotate an image using CSS:
HTML
<!DOCTYPE html>
<html>
<head>
<title>Image Rotation Example</title>
<style>
.rotate-image {
transform: rotate(45deg);
}
</style>
</head>
<body>
<h1>Rotated Image</h1>
<img src="path/to/image.jpg" alt="Rotated Image" class="rotate-image">
</body>
</html>In the above example, the CSS style .rotate-image is applied to the <img> tag using the class attribute. The transform property is used with the value rotate(45deg) to rotate the image by 45 degrees clockwise.
You can adjust the degree value to rotate the image to the desired angle. Negative values can be used for counterclockwise rotation.
Make sure to replace the "path/to/image.jpg" with the actual path or URL of your image.
Feel free to modify the HTML and CSS to suit your specific requirements and styling preferences.