Question

我添加了一个名为Registration的菜单项，我尝试使用custom.css将其右对齐。（由于缺少声誉，我无法发布截图，因为这是我的第一篇帖子）

以下是我目前在custom.css中的内容

<script type="text/javascript" src="~/scripts/Main/main.js?319"> </script>

li.nav-registration {
    text-align: right;
    float: right;
}

custom.css中的样式正在正确设计样式。但是，“注册”菜单仍未正确对齐 - 我们将不胜感激。

Answer 1

据我了解，您必须创建2个单独的navbar元素。一个用于About, Music, Video, Contact，另一个用于Registration：

＆＃13;

   <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li><a asp-area="" asp-controller="Home" asp-action="About">About</a></li>
        <li><a asp-area="" asp-controller="Music" asp-action="Index">Music</a></li>
        <li><a asp-area="" asp-controller="Home" asp-action="Video">Video</a></li>
        <li><a asp-area="" asp-controller="Home" asp-action="Contact">Contact</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li class="nav-registration"><a asp-area="" asp-controller="Home" asp-action="Registration">Registration</a></li>
      </ul>
</div>

＆＃13;

您没有说明您使用的是Bootstrap v3还是v4。无论哪种方式，解决方案都是相同的，你必须分开2＆＃34;导航＆＃34;。它只是您需要的类，它们将根据引导版本进行更改。

Bootstrap 3示例： https://getbootstrap.com/examples/navbar/

Bootstrap 4导航栏代码： https://v4-alpha.getbootstrap.com/components/navbar/#supported-content

CSS：Bootstrap菜单项右对齐

1 个答案: