ホバー時に背景色を変更する方法

.hover-bg-change {
  background-color: 初期の背景色;
  transition: background-color 0.3s ease;
}
.hover-bg-change:hover {
  background-color: 変更後の背景色;
}

この方法では、.hover-bg-changeというクラスを要素に追加し、ホバー時に背景色を変更します。初期の背景色と変更後の背景色には、適切な色の値（例えば、#ff0000やredなど）を指定してください。

var element = document.getElementById('要素のID');
element.addEventListener('mouseover', function() {
  this.style.backgroundColor = '変更後の背景色';
});
element.addEventListener('mouseout', function() {
  this.style.backgroundColor = '初期の背景色';
});

この方法では、要素のIDを要素のIDに置き換え、初期の背景色と変更後の背景色には適切な色の値を指定します。

$('#要素のID').hover(
  function() {
    $(this).css('background-color', '変更後の背景色');
  },
  function() {
    $(this).css('background-color', '初期の背景色');
  }
);

この方法では、要素のIDを要素のIDに置き換え、初期の背景色と変更後の背景色には適切な色の値を指定します。

これらの方法を使用すると、ユーザーが要素上にマウスをホバーしたときに背景色を変更することができます。適用方法は、使用しているプログラミング言語やフレームワークによって異なる場合がありますので、ご注意ください。