Html 使用CSS显示背景图像及其'；它不工作了

我正在尝试使用一个图像作为链接，并使用CSS来显示该图像，但是它不工作，并且根本不显示该图像

HTML

---

根据定义，

width

和

height

不适用于具有

display:inline

的元素，这是

a

元素的默认值

使用

display:inline block

或

display:block

，或浮动链接（具体取决于您希望在此处实现的功能）。

为什么不

<a href="#"><div id="nav_a_img"></div></a>


#nav_a_img{
    background: url("image/nav/home.png") no-repeat;
    width: 32px;
    height: 32px;
}
#nav_a_img:hover{
    background: url("image/nav/home_w.png") no-repeat;
    width: 32px;
    height: 32px;
}

#导航图像{
背景：url（“image/nav/home.png”）不重复；
宽度：32px；
高度：32px；
}
#导航图像：悬停{
背景：url（“image/nav/home_w.png”）不重复；
宽度：32px；
高度：32px；
}

#导航图像{
背景：url（“image/nav/home.png”）不重复；
display:block；/*这也是尝试过的，只是不明白为什么它甚至没有按应有的方式显示图像。你确定图像的URL是正确的吗？通常是“/images/etc”，而不是“/image/etc”。这是因为CSS中需要display:block
#nav_a_img{
 background: url("image/nav/home.png") no-repeat;
 width: 32px;
 height: 32px;

}

#nav_a_img:hover{
 background: url("image/nav/home_w.png") no-repeat;
 width: 32px;
 height: 32px;
}

<a href="#"><div id="nav_a_img"></div></a>


#nav_a_img{
    background: url("image/nav/home.png") no-repeat;
    width: 32px;
    height: 32px;
}
#nav_a_img:hover{
    background: url("image/nav/home_w.png") no-repeat;
    width: 32px;
    height: 32px;
}

#nav_a_img{
 background: url("image/nav/home.png") no-repeat;
 display:block; /*<=== add this*/
 width: 32px;
 height: 32px;
 }