html - 尝试在我的无序列表中移动列表元素

Question

所以基本上我有一个无序列表，我使用 css 使用 (display:inline) 将列表显示在一行中。我遇到了一个问题，我试图将其中一个列表元素定位到页面的另一侧。它将基本上作为一个整体。如何将它们彼此分开移动？提前致谢! #保存我的代码

<ul class="nav nav-pills">
 <li>
   <a href='#'id="port">Portfolio</a>
 </li>
<li>
  <a href='#'id="youtube">Youtube</a>
</li>
<li>
  <a href='#'id="blog">Blog</a>
</li>
<li>
  <a href='#'id="photo">Photography</a>
</li>
</ul>

Answer 1

使用 pull-right 类将您的元素拉到页面的右侧。

<ul class="nav nav-pills">
    <li class="pull-right">
       <a href='#'id="port">Portfolio</a>
    </li>
    <li class="pull-right">
      <a href='#'id="youtube">Youtube</a>
    </li>
    <li>
      <a href='#'id="blog">Blog</a>
    </li>
    <li>
      <a href='#'id="photo">Photography</a>
    </li>
</ul>

或者，使用

.pull-right {
    float: right
}

如果您没有使用 Bootstrap 。

希望这对您有所帮助!