<a class = "rolloverimage" href = " #URL " > Rollover Image
Note: if you want to make click on the image, replace #URL with the URL of the webpage you want to link to.
Use CSS to Background image
To create the mouse over-image effect, we create & # 39; I use the: hover CSS pseudo-class, and then we use the properties ap background-position and set the values to 0 0 to move the background image to the upper-left corner, creating the rollover effect.
Note: Replace the text in blue with the URL of your image file. Note the width and height values that are highlighted in red, they must differ depending on your file, where the height value is only for one image and not for the entire image file!
Hover your mouse over the light bulb to see the rollover-image effect in action:
Add rollover image to Blogger
Or, if you want to add this from your messages, when you create a new message, go to the & # 39; HTML & # 39; and paste the codes into the empty box.
And thus you can swap images with mouseover using CSS. Lots of fun!