Question

我有一个无序列表，我正在水平显示为页面的顶部菜单栏。我已经让它显示得相对好，虽然我一直在玩IE6和IE7的间距导致它无法正常显示。令人震惊的。在任何一种情况下，最好是使用表格来显示菜单或使用一些CSS黑客，这是我找不到的方法？显示菜单的最佳方式是什么？我应该使用自己的无序列表添加一些带有下拉菜单的选项。

Answer 1

结帐List-a-matic，它有许多不同的菜单模板供您用作基础。

可以使用css和无序列表显示简单的水平列表

HTML

<div id="navcontainer">
 <ul id="navlist">
  <li id="active"><a href="#" id="current">Item one</a></li>
  <li><a href="#">Item two</a></li>
  <li><a href="#">Item three</a></li>
  <li><a href="#">Item four</a></li>
  <li><a href="#">Item five</a></li>
 </ul>
</div>

CSS

#navlist li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}

Answer 2

如果您没有SSCCE（包含doctype和嵌入式样式的简单<html>文档），很难给出明确的答案，这些文档会再现完全您遇到的问题。但我至少可以说，常见的问题是你没有得到the doctype正确而且IE's boxmodel bug在这里起作用。

如果这不是根本原因，那么下一个可能的原因是无法理解如何使用floats和/或内联/块元素。为了获得良好而可靠的代码示例，Google "suckerfish menu"。

Answer 3

修改：

您无法依靠display: inline-block来处理此问题，因为跨浏览器支持存在问题。使用浮点数代替dispaly: inline; position: relative。

我会继续使用UL。不要使用IE *的黑客攻击 - 使用IE Conditionals为不同版本的IE添加不同的样式表。

菜单作为无序列表水平或表？

3 个答案: