以下代码以垂直方式输出列表。我如何调整它以使其出现在水平列表中？例如:http://www.nol.com.sg/wps/portal/nol
<body>
<ul id="mainmenu">
<li><a class="menu" href="">Menu</a>
<ul>
<li><a href="">Home</a></li>
<li><a href="">About</a></li>
</ul>
</li>
<li><a class="menu" href="">Company</a>
<ul>
<li><a href="">History</a></li>
<li><a href="">News</a></li>
</ul>
<li><a class="menu" href="">Contact Us</a></li>
</ul>
</body>
最佳答案
HTML
<ul id="mainmenu">
<li><a class="menu" href="">Menu</a>
<ul>
<li><a href="">Home</a>
</li>
<li><a href="">About</a>
</li>
</ul>
</li>
<li><a class="menu" href="">Company</a>
<ul>
<li><a href="">History</a>
</li>
<li><a href="">News</a>
</li>
</ul>
<li><a class="menu" href="">Contact Us</a>
</li></li>
</ul>
CSS
#mainmenu li {
float:left;
list-style-type:none;
margin-right:1px;
width:80px;
text-align:center;
}
#mainmenu li li {
float:none;
padding:0;
}
#mainmenu li ul {
display:none;
padding:0;
}
#mainmenu li:hover ul {
display: block;
}
关于html - 如何将以下垂直列表更改为水平列表？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23013168/