html - 图片与菜单

Question

我想在我的图像中有这个菜单。我遇到了问题，我的图像不在菜单中。菜单将在我的图像中向上或向下。我想将我的菜单放在图像中。我正在处理我的 Microsoft 网络表达式。

<ul>
<li><a>Home  </a></li>
<li><a>About</a>
<ul>
<li><a>Our Team </a></li>
<li><a>Our Team </a></li>
<li><a>Our Team </a></li>
<li><a>Our Team </a></li>
</ul>
</li>
<li><a>things to do </a>
<ul>
<li><a> Team </a></li>
<li><a> Team </a></li>
<li><a> Team </a></li>
<li><a> Team </a></li>
</ul>
</li>
<li><a>contact</a>
<ul>
<li><a>serTeam </a></li>
<li><a>serteam </a></li>
</ul>
</li>
<li><a>News</a></li>
</ul>

我的代码的 .css 部分

ul {
margin: 0px;
padding: 0px;
list-style: none;
}
ul li {
float: left;
width: 200px;
height: 40px;
background-color: black;
opacity: .8;
line-height: 40px;
text-align: center;
font-size: 20px;
}
ul li a {
text-decoration: none;
color: white;
display: block;
}
ul li a:hover {
background-color: green;
}
ul li ul li {
display: none;
}
ul li.hover ul li {
display: block;

标签： htmlcss