Изменение цвета кнопки мыши при наведении HTML

Мне нужно изменить эту кнопку на background-color #838383, когда пользователи наводят на нее указатель мыши, я пробовал много вещей, но не могу заставить ее работать.

<table width="60%">
  <tbody>
    <tr>
      <td width="130PX" style="text-align: left;">
        <a style="padding: 10px 35px; background-color: #ff0000; color: #fff; text-transform: uppercase; letter-spacing: -.2px; text-decoration: none; font-family: helvetica,arial,sans-serif; border-radius: 20px; font-size: 12px;"
          href="mailto:[email protected]?subject=Subject">EMAIL US</a>
      </td>
      <td>
        <b>Bla bla bla</b><br>
        Bla bla bla..
      </td>
    </tr>
  </tbody>
</table>

button background-color mouseover
person Qhdc Australia    schedule 18.05.2015    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вы должны использовать класс для своего тега <a> и добавить стиль для события наведения.

https://jsfiddle.net/yLkr9as0/

<style>
  .mylink {
    padding: 10px 35px;
    background-color: #ff0000; 
    color: #fff; 
    text-transform: uppercase; 
    letter-spacing: -.2px; 
    text-decoration: none; 
    font-family: helvetica,arial,sans-serif; 
    border-radius: 20px; 
    font-size: 12px;
  }

  .mylink:hover  {
    background-color: blue;
  }
</style>

<table width="60%">
  <tbody>
    <tr>
      <td width="130PX" style="text-align: LEFT;">
        <a class="mylink" href="mailto:[email protected]?subject=Subject">EMAIL US</a>
      </td>
      <td>
        <b>Bla bla bla</b>
        <br>
        Bla bla bla..
      </td>
    </tr>
  </tbody>
</table>
person alebruck    schedule 18.05.2015
comment
Спасибо, alebruck. Единственная проблема в том, что у меня нет доступа к CSS, какая-то сторонняя компания берет тысячу долларов в секунду за любые изменения CSS, поэтому я пытаюсь обойти это с помощью HTML. - person Qhdc Australia; 18.05.2015
comment
У вас есть несколько вариантов сделать это, все они описаны здесь stackoverflow.com/questions/1033156/ - person alebruck; 18.05.2015
comment
Если вы можете изменить HTML, вы можете добавить этот код в тег <style>. Обновил код примера. - person alebruck; 18.05.2015