RollOver and RollOut Effect on Button in a Website

<input type="button" value=" Girfa : Student Help " id="b1"    
      onmouseover="this.style.fontWeight='bold';"
      onmouseout="this.style.fontWeight='normal'";
      />

<input type="button" value=" Girfa : Student Help " id="b1"
      style="background-color:'blue'"
      onmouseover="this.style.backgroundColor='aqua';"
      onmouseout="this.style.backgroundColor='blue'";
      />



<input type="button" value="Girfa : Student Help"
      onmouseover="this.style.color='Blue';this.style.backgroundColor='yellow';this.style.border='outset 3px red'"
      onmouseout="this.style.color='';this.style.backgroundColor='';this.style.border=''" />