Reputation: 417
I want to make a CSS class so that i can use it like this
<input type="button" class="hoverbuttons">
So how do I make a class so that my button will hover?
I have two buttons already. Assuming those URLs to be URL1 and URL2 how can I make them hover-able using CSS?
Upvotes: 2
Views: 14350
Reputation: 3123
The easiest way is to use sprites. You'll need to change the <input>
tags to <a>
tags:
<style>
a.link1 {
display:block;
height:10px;
background:url(image.jpg) no-repeat 0 0;
}
a.link1:hover {
background:url(image.jpg) no-repeat 0 -10px;
}
</style>
<a href="URL1" class="link1">foo</a>
Upvotes: 3
Reputation:
just apply these rules:
.hoverbuttons { ... }
.hoverbuttons:hover { ... }
note: on IE6 and previous :hover
pseudoclass will work only on <a>
elements.
Upvotes: 0
Reputation: 45335
Something like this:
<style type="text/css">
.some {
background-color:#0F9;
}
.some:hover {
background-color:#F00;
}
</style>
</head>
<body>
<div class="some"> dsadsad </div>
</body>
Upvotes: 0
Reputation: 1084
http://www.pixelmill.com/support/support_article.aspx?ParentListID=al1015&articleid=kb101543
Upvotes: 0