我正在尝试制作一个在此示例中显示的简单水平列表菜单,到目前为止,我已将 List & CSS 复制到jsFiddle(新示例更新),但它似乎无法以类似的方式工作。我找不到可以查看和复制的类似示例。
我将不胜感激这方面的帮助。
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a>
<ul>
<li><a href="graphic-design.html">Graphic Design</a></li>
<li><a href="web-design.html">Web Design</a></li>
<li><a href="multimedia.html">Multimedia</a></li>
<li><a href="exhibitions.html">Exhibitions</a></li>
<li><a href="trademarketing.html">Trade Marketing</a></li>
</ul>
</li>
<li><a href="work.html">Work</a></li>
<li><a href="clients.html">Clients</a></li>
<li><a href="wordpress">Blog</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
CSS
nav#mainnav ul {
bottom: 57px;
height: 0;
list-style: none outside none;
margin: 0;
padding: 0;
position: absolute;
right: 0;
}
nav ul {
list-style: none outside none;
}
ol, ul {
color: #242320;
font-size: 0.8em;
font-weight: bold;
line-height: 1.3em;
margin: 10px 40px;
}
ul {
margin-left: 30px;
}
更新:
我可以使它作为水平菜单工作,但是一段时间后我无法淡出子菜单我该怎么做示例更新