使用 CSS 3 使列表中的项目右对齐

Question

我有一个列表如下：

 <ul id="menu">
  <li><a href="#">Home</a></li>
  <li><a href="#">Work</a>
      <ul>
           <li><a href="#">CSS Development</a></li>
           <li><a href="#">Graphic Design</a></li>
           <li><a href="#">Development Tools</a></li>
           <li><a href="#">Web Design</a></li>
      </ul>
  </li>
  <li><a href="#">About</a></li>
  <li><a href="#">Contact Us</a></li>
  <li><a href="#">Feedback</a></li>
</ul>

我附上了到目前为止我所做的事情的图像。

在这个菜单中，我想将反馈对齐到右侧。我该怎么做？

原文由 user2091061 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

将此添加到您的 CSS 内容中。

li:last-child 将选择菜单列表的最后一个 li 。

演示

#menu > li:last-child
{
    float:right;
}

原文由 PSL 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

只需使用 float: right; ：

 <ul id="menu">
  <li><a href="#">Home</a></li>
  <li><a href="#">Work</a>
      <ul>
           <li><a href="#">CSS Development</a></li>
           <li><a href="#">Graphic Design</a></li>
           <li><a href="#">Development Tools</a></li>
           <li><a href="#">Web Design</a></li>
      </ul>
  </li>
  <li><a href="#">About</a></li>
  <li><a href="#">Contact Us</a></li>
  <li style="float: right;"><a href="#">Feedback</a></li>
</ul>

您可以在 此处查看演示。

原文由 Minko Gechev 发布，翻译遵循 CC BY-SA 3.0 许可协议