Please help with CSS/PHP rollover effect?

kilot_only

New member
Hello.

I want an effect on the image that is on my index.php and it being controlled by main.css (Yes I am a newb lol). The image in index files i called button1 and css file that controls the button1 looks like this

#button1 {
background-image:url(bg1.png);
width:134px;
height:43px;
background-repeat: no-repeat;
background-position: bottom;


}

What line can I add to the code so when I move the mouse over it, it would switch to some other image of the same size in my case that other images is called bb.png I want it to replace original pg1.png I don't want to use roll over effect that comes with Dreamweaver in this case. But in addition I want the image that comes out to be clickable after the mouse is on top linked to Google.com.

I have 11 buttons in total so I have to figure out how to change CSS file so I don't have to remake the rollover effect on every page that will be created after.

Thank you.
 
Back
Top