html - 画像ホバーが機能しない - コードの何が問題なのですか?

Question

これらの画像リンクにカーソルを合わせたときに画像を変更するために、考えられるすべてを試したようです。現在、メインの navprint.png のみが表示されています。私はhtmlとcssに関しては初心者で、この問題に何日も苦労しています。これがコードです。どんな助けでも本当に感謝しています。

html

<li class="navprint"><a href="printcategory.html"><img src="Images/navprint.png"      alt="print button" title="print button"></a></li>

CSS

.navprint {
    width: 160px;
    height: 30px;
    background-image: url("Images/navprint.png");
}

.navprint:hover {
    background-image: url('Images/navprinthov.jpg');
    width: 160px;
    height: 30px;
}

Answer 1

これを試してみてください

<li class="navprint">
 <a href="printcategory.html">
   <img src="Images/navprint.png" alt="print button" title="print button" />
 </a>
</li>


.navprint {
    width: 160px;
    height: 30px;
    background-image: url("Images/navprint.png");
}

.navprint:hover {
    background-image: url('Images/navprinthov.jpg');
}