Background-image切换无效问题

---

问题描述

鼠标划过时候切换图片，但是没有效果。

<div class="container">
    <a href="#" id="a1">五彩导航1</a>
  </div>
  
#a1 {
  background-image: url(../img/bg1.png);
}
a:hover {
  background-image: url(../img/bg8.png);
}

原因分析：

提示：优先级的问题：

不切换是因为优先级出现了问题，
解决方案：

---

解决方案：

方法 1.更改其他的选择器，来改变优先级
方法 2.使用!important来加强优先级，使之优先级最高。

如：
a:hover {
  background-image: url(../img/bg8.png) !important;
}

即可