Заставьте изображение появиться на ссылке
Я работаю с этим, возможно, простым решением, но мне не удалось найти какую-либо помощь по стеку и Интернету, касающуюся этой конкретной проблемы.
У меня есть меню, и я хочу, чтобы изображение появлялось под ссылкой или закрывалось при наведении на него курсора. Я надеюсь, что это можно сделать в CSS. Это мой код до сих пор.
HTML
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="startpage.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<div id="wrapper">
<img id="baggrund" width="166" height="327" alt="back image" src="images/laerkeryg.jpg"/>
<img id="cirkler" width="319" height="249" alt="circles" src="images/circles.PNG"/>
<div id="header">/jacob gerlif pilegaard/</div>
<div id="underheader">portfolio</div>
<ul>
<li><a href="index.html">home</a></li>
<li><a href="about.html">about</a></li>
<li><a href="gallery.html">gallery</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
<img id="menucircle" width="50" height="50" alt="menu circle" src="images/circle.PNG"/>
</body>
</html>
И это пока CSS:
a:hover
{
background-image: url('image/circle.PNG');
background-repeat: no-repeat;
}
Надеюсь, вы, ребята, можете мне помочь!