html - 试图让菜单与 html 和 css 内联

Question

我已经使用列表在 html 中创建了一个菜单列表，我已经将该列表添加到一个名为 menu 的 div 中。在我的 css 中，我添加了 display:inline 以尝试使列表以内联方式显示列表，通常这可行，但由于某种原因它似乎不起作用。

这是我的代码

#menu ul {
  width: 100px;
  position: absolute;
  z-index: 1;
  background: white;
  padding-top: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: inline;
}

<div id="menu">

  <ul>

    <li><a href="index.php">Home</a>
    </li>&nbsp; &nbsp; &nbsp;
    <li><a href="about.php">About Us</a>
    </li>&nbsp; &nbsp; &nbsp;
    <li><a href="Specials.php">Specials</a>
    </li>&nbsp; &nbsp; &nbsp;
    <li><a href="terms.php">Terms</a>
    </li>&nbsp; &nbsp; &nbsp;
    <li><a href="contact.php">Contact Us</a>
    </li>&nbsp; &nbsp; &nbsp;

  </ul>

</div>

Answer 1

你需要在你的 ul li 而不是 ul 上放置内联显示，因为你只有一个 :)

因此，将您的 css 更改为:

    #menu ul li
{

 width: 100px;
 position: absolute;
 z-index: 1;
 background: white;
 padding-top: 20px;
 margin: 0;
 padding: 0;
 list-style:none;
 display:inline;
}