button style, css

Question

Hi,

Is it possible that when I move on the button mouse, change button styles?

When the cursor on the button, show this style:

input.button_p
{
   color: #000000;
   border-style: none;
}

When the cursor no't on the button, show this style:

input.button_a
{
   color: #FFFFFF;
   border-style:solid;
}

Thanks

Answer 1

input.button {
  color: #000000;
  border-style: none;
}

input.button:hover {
  color: #FFFFFF;
  border-style:solid;
}

Note that the :hover attribute in this usage isn't support by all of the browsers.. But it is supported in enough of them to not worry about it.

Answer 2

You can use the :hover pseudo class, like this:

input.button_p {
  color: #000000;
  border-style: none;
}
input.button_p:hover {
  color: #FFFFFF;
  border-style:solid;
}

And the element just has the button_p class, like this:

<input type="button" class="button_p" />

Answer 3

<input type="submit"> and <input type="button"> are not styleable on all browsers. You should be using <button type="submit">text</button> instead.